見出し画像

mobx-react で複数の store を inject する方法

mobx-react を使うと、ステート管理の store を任意の React.Component に注入(inject)できる。

@inject('someStore')
@observer
class SomeScreen extends React.Component {
  render() {
    const { someStore } = this.props; // 注入した store は this.props から取得できる
   return (
      <View>
        <Text>someStore.somedata</Text>
      </View>
    )
  }
}
export default SomeScreen;

この時、複数の store を注入するには、 @inject にカンマ区切りで指定すればOK。

@inject('some1Store', 'some2Store')
@observer
class SomeScreen extends React.Component {
  render() {
    const { some1Store, some2Store } = this.props;
   return (
      <View>
        <Text>some1Store.somedata</Text>
        <Text>some2Store.somedata</Text>
      </View>
    )
  }
}
export default SomeScreen;

いいなと思ったら応援しよう!