使用导航和装饰器反应本机 Mobx 抛出错误

Question

当我尝试使用 React Native Single Store 时。注入 Home Component 后，store 在 Home 组件的 props 中不可见。

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

GitHub Link: 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

的提供商传递我的商店

Answer 1

最好用这个

2021 年 5 月更新

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

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

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

使用导航和装饰器反应本机 Mobx 抛出错误

React native Mobx with navigation and decorator throws an error

javascript

react-native

mobx

mobx-react

react-native-navigation