React Mobx - 从其他商店更改商店不渲染观察者组件

Question

我必须在一家商店上通过 @action 函数更新 @observable 变量。当我从 component class 调用此 @action 时，它会更改 @observable 变量并重新呈现 @observer 组件。但是，当我尝试通过回调从 其他商店 中的 @action 调用此 @action 时，@observable 变量已更改，但 @observer 组件不重新渲染。

一家商店：


class OneStore {
   @observable variable;

   @action
   setVariable(value) {
      this.variable = value;
   }
}

其他商店：

class OtherStore {

   @action
   setVariable(callBack, value) {
      callBack(value); //callBack is oneStore.setVariable
   }
}

@observer 分量：

@inject('oneStore')
@observer
class ObserverComponent extends Component {

   render() {
      if (this.props.oneStore.variable) {
         return (
            <div> {this.props.oneStore.variable} <div/>
         );
      } else { return null; }
   }
}

我也尝试通过 @computed get 函数获取变量，它仍然没有重新渲染。

Answer 1

我尝试将绑定添加到操作中 - @action.bound 它很有效...

我认为OneStore的this嵌套回调后被销毁了。

正确的代码是：

class OneStore {
   @observable variable;

   @action.bound
   setVariable(value) {
      this.variable = value;
   }
}

React Mobx - 从其他商店更改商店不渲染观察者组件

React Mobx - Change store from other store not render observer components

reactjs

mobx

mobx-react