用导航和装饰器反应本机Mobx会引发错误

时间:2019-07-30 20:00:32

标签: javascript react-native mobx react-native-navigation mobx-react

当我尝试使用React Native Single Store时。注入Home组件后,商店在Home组件的道具中不可见。

通过显示Home组件的道具,我无法访问使用Provider从App.js传递给Home组件的商店。

GitHub链接:https://github.com/FreelancerAnkit/Mobx1

请帮忙!

Store.js


import {observable, action} from 'mobx';

class TestStore {
  @observable loading = true;
  @observable count = 123 ;

  @action loadingCompleted() {
    this.loading = false;
  }

  @action toggleLoading() {
    this.loading = this.loading ? false : true;
  }
}

export default new TestStore();

App.js



import React, {Component} from 'react';
import { Provider, inject, observer  } from "mobx-react/native";
import Home from './app/Home';
import store from "./app/TestStore";

class App extends Component{

  render(){
    return (
      <Provider {...{store: store}}>
        <Home />
      </Provider>
    )
  }
}

export default App;

Home.js


import {inject, observer} from "mobx-react/native";
import React from "react";
import { ActivityIndicator,View, Text } from "react-native";

@inject('store') @observer
export default class Home extends React.Component {

   componentDidMount() {
     alert(JSON.stringify(this.props))
   }
   render() {
      return (
         <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
            <Text>Landing Page</Text>
         </View>
      );
   }

}

预期结果: 提醒this.props应该显示我的商店,但没有Mobx提供商通过我的商店

1 个答案:

答案 0 :(得分:0)

最好使用这个

import { Provider } from 'mobx-react/native'

....

<Provider { ...Store }>
    <Login />
  </Provider>