react-native - React native 导航跨屏通知 "snackbar"

标签 react-native react-navigation react-navigation-stack

尝试使用 react-navigation 在 React Native 中跨多个屏幕实现“无互联网”通知。我试图避免将组件添加到所有屏幕 View 渲染函数中,因为它感觉像样板。

有没有一种简单的方法可以使用 React Native Navigation 在一个地方添加一个组件,并让它在所有屏幕上保持不变?

最佳答案

我认为这个通知与你的导航没有太大关系,应该在它之外实现。在我们的应用程序中,我们有一个类似的通知横幅,它在我们的导航器外部调用并处理错误消息的显示,例如没有连接。

我们的 App.js 看起来像这样:

<Provider store={store}>
        <View>
          <Message /> // message banner
          <AppNavigator /> // this is our navigation
        </View>
  </Provider>

Message 组件脱离了导航,连接到了我们的 redux store。每次出现错误时,我们都会发送一个 redux 操作并显示消息,而根本不通过导航。

关于react-native - React native 导航跨屏通知 "snackbar",我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53534690/

相关文章:

react-native - 重复声明 "AnimatedComponent"可能是 react-native 的内部错误

javascript - 将参数从 Stack-navigator 传递到选项卡导航器 (react-navigator 5)

javascript - React Navigation SwitchNavigator - 在多个堆栈之间导航

react 原生 Material 顶部选项卡导航器滑动禁用取决于屏幕

react-native - 嵌套选项卡导航器中的React Navigation header 标题

javascript - 需要在 react 导航中设置默认 Prop

react-native - 如何在 react 导航(3.x)中为全屏模式提供透明背景?

javascript - 更改按钮颜色 onPress(切换功能) React Native

react-native - 在屏幕滚动端触发事件

ios - [iOS][ReactNative v0.19.0] 自定义 View 出现意外的黑色背景