问题标签 [react-native-router-flux]

我是反应世界的新手，我试图了解构建我的代码的最佳方式。

实际上，它是使用 react-native-router-flux 的 react-native，但我不相信这些对问题有任何影响。

我试图设置这样的启动画面：

当应用程序启动时，该场景被渲染，并调度一个 init 动作。通过减速器后，它将状态更改为已验证或显示锁定，然后我将重定向到下一个场景。

实际上，这一切都完美无缺。但是我收到以下警告：

警告：setState(...)：在现有状态转换期间无法更新（例如在render或其他组件的构造函数内）。渲染方法应该是 props 和 state 的纯函数；构造函数副作用是一种反模式，但可以移至componentWillMount.

完成类似事情的推荐方法是什么？

即在商店状态更改时调用方法？

• 反应原生 0.38.1

• 反应本机路由器通量 3.37.0

  我想基于身份验证实现动态选项卡，当用户登录时，显示主页和个人资料选项卡，否则仅显示主页选项卡

  我使用Switch但不工作。

  /li>

我的问题实际上是关于想要在react-native-router-flux 中说明的错误的确切行为：如何防止选项卡场景历史堆栈在选项卡之间更改时被重置？

我正在从链接的问题中复制确切的场景描述和代码片段，因为这正是我所需要的

我有一个Router带有 2 个选项卡场景的设置：

• 选项卡 1：有 2 个可导航场景（静态屏幕）；
  • 屏幕 A：有一个按钮可以导航到屏幕 B；
  • 屏幕B：只有一个文本；
• 选项卡 2：只有 1 个静态屏幕。
  • 屏幕C：只有一个文本；

代码如下。

应用程序.js：

画面也很简单。

一个.js：

b.js：

c.js：

所需的用例：

• 应用程序呈现屏幕 A（在选项卡 1 中）；
• 单击屏幕 A 中的按钮：应用导航到屏幕 B（仍在选项卡 1 中）；
• 单击选项卡 2：应用程序导航到屏幕 C（在选项卡 2 中）。
• 单击选项卡 1：应用程序导航到屏幕 A（在选项卡 1 中）而不是屏幕 B，因为它是设计使然。

我知道我可以实现一个自定义减速器来解决这个问题，但我相信必须有一个更直接的解决方案我可能会忽略。

我在一个屏幕上有一个用户列表https://screencast.com/t/RQp8IrWdV5qf，当您单击列表中的任何项目时，它会通过调度showProfile具有用户 ID 的操作来显示单个用户，您可以通过 ListItem 代码看到：

我想要的是，当我单击右下角的“个人资料”选项卡时，打开具有特定 ID 的用户的个人资料（登录用户）：

如您所见，我正在尝试做类似的事情onEnter={dispatch(showProfile(1))}。这样做的正确方法是什么？

使用react-native-router-flux，用户成功登录后，我想禁用后退按钮返回登录屏幕。但我似乎无法找到获取当前“场景”或“堆栈”的方法，然后进行一些登录：

有没有人设法处理这个问题？

我react-native-router-flux在我的应用程序中使用并希望为我的 TabIcon 组件传递 png 图像的路径。我知道我可以为每个选项卡制作一个不同的选项卡图标组件，但是除了图像源之外，这些图标将完全相同，我想找到一种 DRY 方式来实现我的目标。我可以在我的场景中的哪个位置传递图像路径？

这是我的 TabIcon 组件：

我的场景：

编辑

我试过像这样传递图像

在我的 TabIcon 组件中，如果我console.log(image)打印出来"../images/feed.png"但我在模拟器中收到此错误：

我有一个新的 React Native 应用程序 - 使用 redux、reduxThunk 和 react-native-router

addBrandForUser()我有一个 listItem 组件，当用户单击它时会触发 redux 操作。

单击会触发以下操作：

然后在所有正确的减速器中对其进行评估。这一切都有效并且正确链接 - 所有调试器都到达了我期望它们的位置。

但是，我得到了Warning: setState(...): Cannot update during an existing state transition (such as within `render` or another component's constructor). Render methods should be a pure function of props and state; constructor side-effects are an anti-pattern, but can be moved to `componentWillMount例外....但前提是该Actions.main();行未注释。

我的路由器配置如下：

我注意到的一件事是，在SelectBrand调度操作后，reducers 正确更新，并且在导航回 Actions.main() 时视图会相应更新。但是，在调度AddBrandToUser操作之后，reducer 获得了正确的有效负载并正确地返回了新对象，但视图没有相应地更新。

应该更新的视图如下

下面是在上述类中记录的一些输出。此序列addBrandForUser()在 listItem 上触发操作时开始。

看起来新数组正在正确减少，但由于异常而恢复到以前的自我。

更新 1： 这是addBrandForUser()命中的减速器。

更新 2： Actions是 react-native-router-flux 提供给我的一个类：

Actions.main()据我了解，scene使用钥匙的路线main

附加到Main路由的组件如下：

我的应用程序有一个编辑器，其中包含如下几个组件：

• 纽扣
• 农作物
• 页

以上所有组件都是编辑器页面的子组件。所以，我需要做的是从 Buttons 组件更新裁剪器缩放状态。当直接在 UI 组件上使用状态时我没有问题，因为我在这种情况下使用redux。但是当我只需要更新按钮状态时，我很挣扎。

以下是我如何从 Buttons 组件中更改状态：

如何从 Cropper 组件调用上述代码？

我是 React Native 的新手（来自 Web React），我正在弄清楚导航如何与 React Native 一起工作。

我的第一步是查看 Facebook 的导航指南：https ://facebook.github.io/react-native/docs/navigation.html 。它向我展示了三个解决方案：Navigator、NavigatorIOS 和 NavigationExperimental。第二个是未维护的，第一个是有状态的。所以我选择了 NavigationExperimental，它类似于 redux 并且很容易上手。

然后我看了一下谷歌，发现react-native-router-flux。我阅读了他们的文档，迷你教程看起来非常简单，语法对于像我这样的网络开发人员来说似乎更熟悉，但我不明白这与 NavigationExperimental 之间的根本区别。react-native-router-flux 是在 NavigationExperimental 之上的吗？

谢谢。

我正在开发一个应用程序，该应用程序将具有 web 内容，生活在 webview 以及使用 react-native 构建的其他一些内容和视图中。我打算使用 react-native 提供的 Webview。我正在考虑应用程序的生命周期。我想要一种方法来保持安装应用程序的 web 视图。因为当它卸载时，你会失去它的状态。我猜一些导航路由器可以提供帮助。

谢谢！