reactjs - mobx 动作功能不改变存储值

Question

index.js

ReactDOM.render(
  <Provider store={new UserStore()}>
    <IndexPage/>
  </Provider>
);

存储/index.js

class UserStore {
  @observable id = 0;
  @action signin = (id) => {
    this.id = id;
  }
  @action signout = () => {
    this.id = 0;
  }
}

export default UserStore;

页面/index.js

@inject('store')
@observer
class IndexPage extends Component {
  signin() {
    this.props.store.signin(1);
    console.log(this.props.store.id); // it is working. print 1.
  }
  render() {
    return (
      <div>
        {this.props.store.id} // it is not working. not change value.
        <button onClick={this.signin.bind(this)}>signin</button>
        <button>signout</button>
      </div>
    );
  }
}

export default IndexPage;

• 登录功能正在运行。但是，不要更改 this.props.store.id。
• mobx 动作功能不起作用。
• 如何解决？

标签： reactjsmobx