Question

我必须在一家商店中通过@observable函数来更新@action变量。当我从@action类调用此component时，它会更改@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-从其他商店更改商店不会呈现观察者组件

1 个答案: