Question

我正在使用react native挂钩将数据从主屏幕传递到辅助屏幕，但是我得到的某些数据将为空。

const { profileData } = navigation.state.params;

这将导致如下错误： “未捕获的TypeError：无法读取null的属性'stage'”

这是来自我的辅助屏幕上的useEffect的：

 useEffect(() => {
        if(profileData.item.levelrequest.stage == "Submitted") {
            setlrequest05(true)
        } else if(profileData.item.levelrequest.stage == "") {
            setlrequest05(false)
        } else if(profileData.item.levelrequest.stage == "Approved") {
            setlrequest05(false)
        }
    })

如何让它不关心某些用户的stage字段为null？

Answer 1

“无法读取null的'stage'属性”实际上是在告诉您levelRequest是null。这肯定可以意味着stage的任何一个父母都是null ...并且JS中没有任何神奇的方法可以绕过实际检查对象的每个级别以确保它存在

您可以通过使这些字段为必填字段来加强服务器上的架构，但是处理此问题的最直接方法是在函数开始时编写“ guard”条件，例如：

useEffect(() => {
  if (!profileData ||
      !profileData.item || 
      !profileData.item.levelRequest ||
      !profileData.item.levelRequest.stage) {
    // do something to handle null data...probably `return` so the other 
    // conditional of the hook isn't fired
  }
  ...rest of your function here...
})

这是一个粗略的例子，但它表达了这个想法。在this thread中将对这种情况进行更详细的讨论。

使用空的GraphQL数据反应本机挂钩

1 个答案: