首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >如何在屏幕转换过程中使用react本机和react导航处理状态

如何在屏幕转换过程中使用react本机和react导航处理状态
EN

Stack Overflow用户
提问于 2018-04-29 22:30:45
回答 2查看 409关注 0票数 0

在从一个屏幕到另一个屏幕的转换过程中,我得到了一个对象未定义的异常。我很清楚发生了什么,我只是不确定是否有一种干净的方法来处理它,而不只是检查是否到处都是未定义的。

下面是我的场景:

  1. 源屏幕引用Redux存储中的用户对象。
  2. 导航从源屏幕启动到目标屏幕。
  3. 目标屏幕componentDidMount()被调用,我在这里清除了Redux中的用户对象。
  4. 源屏幕呈现()再次被调用,并且出现未定义的错误,因为我从存储中清除了用户。

由于转换,我假设源屏幕和目标屏幕有一些重叠。我试着增加听众而没有运气。我只能让侦听器处理程序为type = action触发,

我可能会使这件事变得比现在更复杂,但我想知道是否有一种标准的方法来处理这件事,或者我是否以一种完全错误的方式来处理这件事。

此外,我的反应导航是与Redux结合,根据说明的反应导航的网站和Redux反应导航样例代码。

这是基本代码。

屏幕1

代码语言:javascript
运行
复制
componentDidMount() {
  // This is a Redux action that sets an object called user to null
  clearUser();
{

屏幕2

代码语言:javascript
运行
复制
render() {
  return (
    // Other code here
    // user is null here because render gets called after Screen1#componentDidMount() gets called
    <Text>{user.firstName + ' ' + user.lastName}</Text>
    <TouchableOpacity
      onPress={() => navigation.dispatch({ type:'NAV_SCREEN_1' })}
    >
      // button code here
    </TouchableOpacity>
    // Other code here
  )
}

错误类型为"TypeError:无法读取null的属性'firstName‘“

我理解这个错误,以及为什么我要得到它。用户对象被我在屏幕1的componentDidMount()中的Redux操作设置为null,然后Redux使屏幕2的呈现被调用,这是引用用户对象为null。

我的问题是,是否有一种特殊的方法来适应这种行为,而不必检查用户对象是否为空?我应该在其他地方打电话给clearUser()吗?

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2018-04-30 19:39:11

对于最新版本的react-navigation,您可以使用addListenerwithNavigationFocusisFocused来检测屏幕的过渡状态。

另一种非官方的方法是捕获动作类型NavigationActions.COMPLETE_TRANSITION,以便使用像redux-saga这样的中间件。

票数 0
EN

Stack Overflow用户

发布于 2018-10-21 16:43:20

作为替代,您可以简单地使您的Redux连接的屏幕句柄未定义或空状态。我也遇到了类似的问题,当用户状态未定义时,我将呈现一个加载程序而不是屏幕内容。当我注销时,屏幕会显示一个加载程序,只需一秒钟,然后应用程序就会离开。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/50091921

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档