Question

我遇到了自动运行问题并设置了父级状态。例如，我的cateogry项目也有子项目：

A类
- Sub 1
- Sub 2
B类
- Sub 3
- Sub 4

现在，如果我访问Sub 4，则B类和Sub 4的状态应该变为活动状态。

在我的子组件中，我的代码如下所示：

export class CategorySubItem extends Tracker.Component {

constructor(props) {
    super(props);

    this.state = {
        active: false
    };

    this.autorun(() => {
        if(LayoutGlobals.get().categoryId == this.props.doc.id) {
            this.setState({active:true});
            this.props.parent.setState({active:true});
        } else {
            this.setState({active:false});
            this.props.parent.setState({active:false});
        }
    });




}

调用子类别项目：

<CategorySubItem doc={cat} key={cat.id} parent={this}/>

LayoutGlobals是一个反应变量。当我设置父母的状态时，我会在无限循环中重新出现。处理这个问题的正确方法是什么？

Answer 1

永远不要设置父组件的状态。所有组件都应该只设置自己的状态。为Category组件编写函数，确定它是否处于活动状态。

我尽量避免autorun。只需将LayoutGlobals.get().categoryId作为支柱传递给组件树，然后实现自己的componentWillReceiveProps功能。这样你就可以让React最大限度地减少重新评估。

ReactJS + Tracker：更新父状态

1 个答案: