android - 使用 React-Native-Router-Flux 在所有屏幕中显示组件 - React Native

Question

我有一个基于 RNRF 的项目，我需要根据 Redux 状态在所有屏幕上显示一个倒计时组件。

我需要在所有屏幕的右下角设置倒计时:

我尝试在 Provider 中设置，但我无法从 redux store 读取状态，以启用或禁用计数器。

<Provider store={store}>
    <PersistGate loading={null} persistor={persistor}>
        <Router />
        <Counter
            data={'123456'}
            mission={'1'}
            bgColor={'#6F31E2'}
            textColor={'#FFFFFF'}
        />
    </PersistGate>
</Provider>

可以用 React Native Router Flux 做到这一点吗？

Answer 1

正如您在代码 fragment 中所做的那样，通过将 Counter 组件放入 App.js 中，这是 100% 可能的。

我不确定你无法从 redux 存储访问状态是什么意思。我刚刚在我现有的生产应用程序之一中创建了一个演示计数器来测试这一点。只要您使用 react-redux 中的“connect”功能，您就应该能够连接到 Counter 组件中的全局 redux 存储:

这是我在演示中使用的工作 Counter.js 文件:

编辑澄清:使用连接将允许Counter 组件本身 能够访问存储，而不是尝试通过 App.js 文件中的 props 向下传递 redux 存储。