小编qbo*_*lec的帖子

我有一个更新我的应用程序的通知状态的操作.通常,此通知将是某种错误或信息.我需要在5秒后发送另一个操作,将通知状态返回到初始状态,因此不会发出通知.这背后的主要原因是提供通知在5秒后自动消失的功能.

我没有运气使用setTimeout和返回另一个动作,也无法找到如何在线完成.所以欢迎任何建议.

Bootstrap为锚点添加了非常好的默认样式,但是它使得<a>标记不适用于蓝色文本以外的其他内容.说,我希望文本是黑色的.一种方法是添加class="my_class"到锚标记,然后放置a.my_class{color:black}规则.

但是我很快就会意识到bootstrap还增加了样式:hover.所以,我也必须改变它.此外,它改变了风格outline,text-decoration,:focus,等.

当然,我可以阅读未经编辑的bootstrap.css版本,并尝试了解我必须覆盖的所有情况,以确保它保持黑色.但我认为必须有一些更简单的方法 - 我期待添加class="link-unstyled"或其他东西？

TL; DR:在具有管理其自己的状态有些复杂的逻辑可重用的组件的情况下(认为:与autocompleter Facebook的评论文字区域,表情符号等),一个人如何使用存储,操作和减速器进行管理的多个实例的状态这个组件遍布整个网站？

考虑官方redux回购中的真实示例.在其中我们有:

• 一个RepoPage,它显示谁已经出演一个特别的回购协议的用户列表中,
• 一个UserPage,显示由特定用户加星标的repos列表
• 一个List,它足够通用,可以显示用户列表或repos,提供了方法items和方法renderItem.特别是RepoPage使用User组件来显示为回购加星标的每个用户,并UserPage使用Repo组件来显示每个加星标的回购.

假设我真的希望所有的状态都在Redux中.

特别是,我希望每个RepoPage和UserPage上的每个List的状态都由Redux管理.在这个例子中已经通过一个聪明的三级深树来处理:

• 在顶层,密钥表示它是什么类型的组件数据(在示例中称为store.pagination)
• 然后,每个特定类型的上下文都有一个分支,其中组件可以是(store.pagination.starredByUser,store.pagination. stargazersByRepo)
• 然后有与唯一上下文一样多的键(store.pagination.starredByUser[login],store.pagination. stargazersByRepo[repo])

我觉得这三个级别也对应于:组件类型,父类型,父ID.

但是,我不知道如何扩展这个想法,以处理List组件本身有很多子项的情况,其中一个状态值得在Redux中进行跟踪.

特别是,我想知道如何实现一个解决方案,其中:

• User 组件保持完整
• Repo 组件有一个切换其背景颜色的按钮
• 每个Repo组件的状态由Redux管理

(我很高兴使用Redux的一些扩展,它仍然使用Reducer,但是不想使用"只是将它保持在React本地状态",为此问题的目的)

我的研究到目前为止:

• 它看起来像在榆树​​上的操作(消息)是可嵌套以这样的方式代数数据类型,即父组件可以解压缩的消息的"外信封"和到子减速器传递旨在用于儿童一个内动作(更新).
• 因为它是终极版公约使用字符串作为动作类型,上述想法的自然转换为使用前缀,而这似乎正是棱镜(foremly称为终极版-榆树)的作用:action.type是由通过组件树告诉路径的子串.OTOH在这篇评论中,棱镜作者tomkis解释说,Redux缺少的Elm Architecture最重要的部分是动作的组合
• 上述两种方法似乎是重用Reducer Logic中描述的方法的扩展版本
• 我还没有完全理解redux-fly如何在内部工作,但它似乎使用有效负载,而不是action.type通过其安装路径识别组件实例,store其中也对应于组件树中的路径,因为它的方式是由组件手动构建 …

我想编写可移植代码（Intel、ARM、PowerPC...）来解决一个经典问题的变体：

Initially: X=Y=0

Thread A:
  X=1
  if(!Y){ do something }
Thread B:
  Y=1
  if(!X){ do something }

其中目标是避免两个线程都在做的情况something。（如果两者都没有运行也没关系；这不是只运行一次的机制。）如果您发现我下面的推理中有一些缺陷，请纠正我。

我知道，我可以通过memory_order_seq_cstatomic stores 和loads实现目标，如下所示：

std::atomic<int> x{0},y{0};
void thread_a(){
  x.store(1);
  if(!y.load()) foo();
}
void thread_b(){
  y.store(1);
  if(!x.load()) bar();
}

这实现了目标，因为
{x.store(1), y.store(1), y.load(), x.load()}事件必须有一些单一的总顺序，它必须与程序顺序“边缘”一致：

• x.store(1) “在TO之前” y.load()
• y.store(1) “在TO之前” x.load()

如果foo()被调用，那么我们有额外的优势：

• y.load() “之前读取值” y.store(1)

如果bar()被调用，那么我们有额外的优势：

• x.load() “之前读取值” x.store(1)

所有这些边组合在一起将形成一个循环：

x.store(1)“在TO之前”“在TO之前y.load()读取值” y.store(1)“在TO之前” x.load()“读取之前值”x.store(true)

这违反了订单没有周期的事实。

我故意使用非标准术语“在 TO …

想象一下,您的移动设备上安装的游戏X想要从社交网络Y访问您的帐户信息.假设Y公开了一些API,并具有"使用Y登录"等功能.在桌面PC X上可以弹出新的浏览器窗口,地址栏中清楚地显示Y的域名,带有明确指示SSL连接的挂锁图标,在此弹出窗口中,社交网络Y会要求用户提供登录,密码和协议以传递一些信息(如姓名,头像,电子邮件)到应用程序X.例如,OAuth 2使用这种方法.

在我看来,在移动设备上情况相当不同,因为应用程序X可以控制整个屏幕.特别是它可以在设备的屏幕上绘制与真实浏览器无法区分的东西,并劫持用户提供的登录和密码.

如何打击覆盖整个屏幕并伪装成浏览器甚至操作系统设置窗口等的恶意应用程序？

从我测试过

"aba".split(/a/).length

回报

• ie8中的1
• 3在firefox,chrome,opera中

我总是准备处理DOM操作或事件模型的差异,但我认为像字符串,正则表达式等的定义很明确.我错了吗？

在W3C规范提出如下实施:一些简单的代码做一些数据从XML文档获取通过网络:

function processData(data) {
  // taking care of data
}

function handler() {
  if(this.readyState == this.DONE) {
    if(this.status == 200 &&
       this.responseXML != null &&
       this.responseXML.getElementById('test').textContent) {
      // success!
      processData(this.responseXML.getElementById('test').textContent);
      return;
    }
    // something went wrong
    processData(null);
  }
}

var client = new XMLHttpRequest();
client.onreadystatechange = handler;
client.open("GET", "unicorn.xml");
client.send();

这个实现真的是对的吗？

调试过程中,我发现情况下,当readystatechanged事件处理程序与readyState的==相同的值称为不止一次在一排4我想这种行为是正确的,因为规范说,国家的每一个变化必须触发事件,以及readyState必须始终等于当前状态,因此如果事件队列中有多个事件堆积,那么很明显,一个将使用readyState == 4获得多个调用.

http://jsfiddle.net/44b3P/ - 这是上面的示例,在发送请求之后使用调试器调用来暂停执行,并在processData中使用alert().一旦取消暂停执行,您将收到3个警报.

来自w3c的这个例子似乎是在网络中的多个位置进行复制和粘贴 - 特别是OpenSocial似乎以这种方式处理xhr事件.这是对的吗？

TL; DR:我是否可以信任协调算法不重新实例化我的有状态组件只是因为虚拟DOM中的更改过于复杂而无法跟踪它？

我相信,React.Component实例是由React运行时创建和销毁的,以匹配Virtual DOM的形状.作为程序员,我声明性地描述了虚拟DOM,实例的生命周期由React本身控制.据我所知,当Virtual DOM改变其形状时,特殊的协调算法会尽可能多地重用旧实例.另外,我理解如果唯一的区别在于道具,那么旧的实例只需通过生命周期方法更新其道具并通知它.

我还希望,对于简单地将道具映射到Virtual DOM的功能组件,谈论生命周期没有意义,因为如果这是相同或不同的实例并不重要.特别是,人们不必相信协调算法非常智能,因为无论是与更新道具相同的实例还是新实例,组件的外观和行为都是相同的.

但在有状态组件的情况下,我是否应该信任协调算法？

比如说,我有一个组件可以将某些数据存储在其状态中,并直接存储在其实例上.此外,我们假设该组件的构造函数初始化它们:

constructor(props) {
  super(props);
  this.state = {
    value: ''
  };
  this.length = 0;
}

此外,假设状态因为用户操作而及时发展

onChange = (e) => {
  this.setState({value: e.target.value}
  this.length = e.target.value.length;
}

我可以,或者我不能,假设这个实例不会在React框架的一时兴起被杀死和重建吗？上面的组件不是"功能性的",因为它具有内部状态,作为开发人员,我认为即使在协调期间组件树的较高部分发生了复杂的事情,也会以某种方式"保留".

从文档和Web中的许多示例中,我理解,社区假定实例的状态和私有属性不会重置,除非父级显式更改key属性,或者删除子级,并实例化后来新的.但这些假设是否在文档中明确说明了？

而另一方面的问题是:改变一个key保证创建一个新实例的孩子,或者可以做出反应决定用一个不同的密钥重用一些旧实例(从而重用它的状态)？换句话说:是保证工作的关键技巧还是仅仅是一个黑客攻击？

编辑 一个有问题的情况的例子:https://codesandbox.io/s/9rqrPJnLD.这里我们有一个有状态的组件:

class Stateful extends React.Component{
  state = { now: new Date()};  
  render(){
    return <div>{this.state.now.toString()}</div>
  }
}

生活在充满敌意的环境中,父母常常改变对布局的看法,而孩子有时会嵌套在div中,有时不会:

class App extends React.Component{
  state = { div: true}
  componentDidMount(){
    setInterval(()=>{
      this.setState(state => { …

我想拥有CSS轻量级类,每个类都意味着一件事.所以我想有一个类说当鼠标悬停在它上面时项目越来越高,另一个表示如果父项不活动则该项目应该变得不可见.问题是每个方面都应该是动画的,所以我transition: height 1s在第一类和transition: opacity 2s另一类中定义.

这是我尝试的简化版http://jsfiddle.net/4WPrU/.这似乎做了一些与我预期完全不同的事情:规则不合并,而只是互相覆盖.

.active_only {
  opacity: 0;
  transition: opacity 1s;
}
.activator:hover .active_only {
  opacity: 1;
}
.elastic {
  height: 20px;
  transition: height 1s;
}
.elastic:hover {
  height: 40px;
}
li {
  border: 1px solid red;
}

<div class="activator">
  Here's a magic list
  <ul>
    <li class="elastic active_only">item one
      <li class="elastic active_only">item two
  </ul>
</div>

周围有优雅的方式吗？

编辑: 更改1s为opacity以2s,以使其更明显的是,我的意思是有完全独立的规则,不能使用合并all.

由于http://avatars.io似乎返回404而不是已经上传的照片，并且不允许上传新照片，所以我发现自己处于不便的境地，必须移至其他服务提供商或实施自己的头像解。后者（根据nk.pl的经验）似乎很耗时，并且我不想让我的网站的用户等待此基本功能，所以我真的很想听听有一些插件替换avatars.io。

我需要一项服务：

1. 允许用户将照片上传到云端（最好直接使用js库从他们的浏览器上传）
2. 存储照片，调整大小，裁剪为正方形
3. 上传后返回一个URL，该URL可以存储在数据库中，并随后用于检索化身

我看到g ++生成一个简单的movfor x.load()和mov+ mfencefor x.store(y).考虑这个经典的例子:

#include<atomic>
#include<thread>
std::atomic<bool> x,y;
bool r1;
bool r2;
void go1(){
    x.store(true);
}
void go2(){
    y.store(true);
}
bool go3(){
    bool a=x.load();
    bool b=y.load();
    r1 = a && !b;
}
bool go4(){
    bool b=y.load();
    bool a=x.load();
    r2= b && !a;
}





int main() {
    std::thread t1(go1);
    std::thread t2(go2);
    std::thread t3(go3);
    std::thread t4(go4);
    t1.join();
    t2.join();
    t3.join();
    t4.join();
    return r1*2 + r2;
}

其中根据https://godbolt.org/z/APS4ZY go1和go2被翻译成

go1():
        mov     BYTE PTR x[rip], 1 …