WiX 导航 从注册组件访问 redux store

Question

我将 WiX 导航与 redux 结合使用。 https://wix.github.io/react-native-navigation/#/usage

在 app.jsx 文件中，我用 redux store 注册了我所有的屏幕：

const createStoreWithMiddleware = applyMiddleware(thunk)(createStore);
const reducer = combineReducers(reducers);
const store = createStoreWithMiddleware(reducer);
registerScreens(store, Provider);

在 registerSceens.js 我绑定了 redux store :

export default (store, Provider) =>  {
Navigation.registerComponent('aApp.FooComponent', () => FooComponent, store, 
Provider);
}

那么在 FooComponent 中，如何轻松访问 redux 存储？

export default class FooComponent extends Component {
constructor(props) {
    super(props);
    console.log(store); //i need REDUX store 
}

Answer 1

您需要使用 react-redux 将 FooComponent 连接到 redux。之后你可以通过道具访问任何东西。

Answer 2

您需要连接您的组件，然后您可以从上下文中获取商店，如下所示：

class FooComponent extends Component {
  static contextTypes = {
    store: object,  // <--- allow this component to access the store
  };

  componentWillMount(props) {
     const { store } = this.context; // <-- Get it!!
     console.log(store); //i need REDUX store 
  }
}
export default connect()(FooComponent);

定义 contextTypes 后，您可以从 this.context 访问商店。

虽然您可以这样做...但问题是...您为什么要这样做？ connect 已经允许您访问状态和绑定操作，通常这就是您所需要的。根据经验，让我们的组件尽可能地愚蠢总是一个好主意。