无法解构 null 的属性

Question

我有一个组件可以从

user

属性中解构

auth

：

 const Profile = ({
     auth: {user}
 }) => {...}

问题是，当我开发时，每当我保存任何更改时，Nodemon 就会不断刷新我的页面。当组件尝试安装时，它会抛出一个错误，无法从

user

解构

auth

，因为

auth

此时为空（直到我导航站点并重新登录）。

有没有一种优雅的方式来处理这个问题？我看了这篇文章，但我做不到像

const { user } = auth || {}

这样的事情。嗯..我的意思是，我可以，但我想从道具中解构，而不是在函数体中执行

const { user } = auth || {}

。

Answer 1

当

auth

为

null

时，无法使用具有解构语法的默认参数来解析

user

而不抛出

TypeError

。

只需解构为

auth

并检查它是否正确：

const Profile = ({ auth }) => {
  const user = auth && auth.user;
  ...
}

Answer 2

按照你的例子，我设法让它以这种方式工作

const { user } = auth ?? {}

这样你就不会得到 Cannot destruct property 'nn' of 'nn'因为它是空的。