在父组件的ViewStore中跟踪状态更改

时间:2019-03-11 13:50:18

标签: reactjs mobx mobx-react

我有2个组成部分:ParentComponent呈现了ChildComponent

父组件具有ParentViewStore,子组件具有ChildViewStore

是否有一种方法可以使用ParentViewStore生命周期方法(例如ChildViewStore)来跟踪React.Component中的ComponentWillReceiveProps()属性更改而没有?

示例代码:

class ParentViewStore{
    @observable a;
}

class ChildViewStore{
    /* 
       code to run when 
       ParentViewStore.a 
       changes
    */
}
ChildViewStore构造函数中的

代码仅运行一次,后续的重新渲染不会再次触发该构造函数。 ParentViewStore作为道具传递给ChildViewStore

我尝试过的事情:

class ChildViewStore{
    @observable parentProperty;

    constructor(props){
        this.parentProperty = props.parentViewStore.parentProperty
        observe(this.parentProperty, (change) => {
            console.log("change")
        });
    }
}

但这会抛出[mobx] Cannot obtain administration from [parentPropertyValue]

1 个答案:

答案 0 :(得分:1)

每次ChildViewStore实例中的a被更改时,您可以在ParentViewStore的构造函数中使用autorun来运行一些自定义逻辑。

示例

class ChildViewStore{
    constructor(props){
        autorun(() => {
            console.log(`a changed: ${props.parentViewStore.a}`);
        });
    }
}