javascript - 由渲染更新的 ReactJS Cortex 对象未调用？

Question

我正在尝试实现 Emberjs 的 Todo 应用程序，作为 github 上 mquan 的 Cortex 练习。我目前正在实现“全部”、“事件”、“已完成”过滤器，其中单击 anchor 将导致 anchor 突出显示(添加了类)。

我创建了以下内容:

var filtercortex = new cortex([
    {title:'all', selected:true, key:1},
    {title:'completed', selected:false, key:2},
    {title:'active', selected:false, key:3}
]);

使用以下渲染函数(在父级中):

  render: function() {
    var filters = filterCortex.map(function(filter) {
      return (
        <li>
          <FilterAnchor cortex={filterCortex} filter={filter} />
        </li>
      )
    });
    ...

    return ...
          <ul id='filters'>
            {filters}
          </ul>

以及FilterAnchor的定义:

var FilterAnchor = React.createClass({
  handleClick: function() {
    var that = this;
    this.props.cortex.forEach(function(filter) {
      if (filter.key.getValue() == that.props.filter.key.getValue()) {
        console.log(filter.title.getValue(), true);
        filter.selected.set(true);
      } else {
        console.log(filter.title.getValue(), false);
        filter.selected.set(false);
      }
    });
    return false;
  },

  render: function() {
    var className = (this.props.filter.selected.getValue()) ? 'selected' : '';
    return (
      <a className={className} href="#" onClick={this.handleClick}>
        {this.props.filter.title.getValue()}
      </a>
    )
  }
});

现在，当我单击时，我没有看到“选定”类被应用于 anchor 链接。

但是，经过调查，我注意到这一点:

Clicking "All":
All true 
Completed false
Active false 

Clicking "Completed":
All true 
Completed false
Active false 

所以我确信filtercortex内的对象已经正确更新(你可以打开firebug来检查)。但是，FilterAnchor.render未被触发。

这是一个错误吗？

源代码:https://github.com/vicngtor/ReactTodo/blob/cortex/script.jsx

Answer 1

Cortex readme顶部的示例底部有这个:

orderCortex.on("update", function(updatedOrder) {
  orderComponent.setProps({order: updatedOrder});
});

您的代码中是否有等效部分？如果不是，则问题在于皮质数据存储的更新事件未设置为触发 View 更新，在本例中， View 更新是通过调用顶级 React 组件上的 setProps 来完成的。