Javascript 当React组件绑定到Mobx可观察存储时会发生什么?
我有一个反应成分Javascript 当React组件绑定到Mobx可观察存储时会发生什么?,javascript,reactjs,mobx,mobx-react,Javascript,Reactjs,Mobx,Mobx React,我有一个反应成分 @observer export default class Tree extends Component 它被绑定到一个可观察的存储 class TreeStore { @observable nodes; } TreeStore的实例作为存储传递给React组件。因此,渲染方法如下所示 render() { const { store } = this.props; // render the nodes within the store } 当我将存储作
@observer
export default class Tree extends Component
它被绑定到一个可观察的存储
class TreeStore {
@observable nodes;
}
TreeStore的实例作为存储传递给React组件。因此,渲染方法如下所示
render() {
const { store } = this.props;
// render the nodes within the store
}
当我将存储作为道具传递给树组件时,一切都按预期进行。但是,当我将一个新的存储对象传递给树组件(一个新实例)时,树组件不会被重新渲染或刷新
容器组件如下所示:
render() {
return (
<div>
<Select value={this.param} onChange={this.handleParamChange} />
<Tree store={this.store} />
</div>
);
}
我想知道幕后发生了什么。当React组件(观察者)绑定到Mobx可观察存储时会发生什么?是什么导致重新渲染发生的?如果我向它传递一个新的存储,我如何重新绑定组件
我浏览了代码。生命周期事件附加到组件。componentWillMount做了很多事情。但无法找出正在观察的对象!!!。(初始化渲染器/反应器渲染器)。如果我在道具中发送一个新的商店,这也会被观察到吗
更新
Mobx工作正常。如果将新存储作为道具传递,则可观察对象将继续触发重新渲染。我的代码中有一些问题。经过一些修复后,代码工作正常。我将结束这个问题。我不会删除它。因为,如果有人有类似的问题,问题在于他们的代码,而不是Mobx。希望有帮助。当上次渲染中取消引用的观察对象发生更改时,将重新渲染观察者反应组件。您是否有在问题中包含渲染代码的选项?这会有很大帮助。@Thole添加了容器组件renderHave您试过使用吗
extendObservable(这个,{store:createAnotherStore()})如果您在CodePen或JSFIDLE项目中复制这一点会很有帮助。我无法复制它。正如预期的那样,Mobx的工作非常出色。我对我的代码进行了代码演练,这比这里概述的要复杂得多。解决了这个问题。我投票结束了这个问题,以避免其他人试图回答它。谢谢
handleParamChange() {
this.store = createAnotherStore(); // store is also observable!
}