无法解构null属性

Question

我有一个将user与其auth道具分解的组件：

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

问题是当我进行开发时，Nodemon会在我保存任何更改时不断刷新我的页面。当组件尝试挂载时，它将引发错误，无法将user从auth中解构，因为auth在那时为空（直到我浏览站点并重新登录）

是否有一种优雅的方式来处理此问题？我看了this article，但无法做类似const { user } = auth || {}的事情。好吧..我的意思是，我可以，但是我想从道具中解构，而不是在函数体中做const { user } = auth || {}。

Answer 1

当auth为null时，无法使用具有解构语法的默认参数来解析user而不会抛出TypeError。

只需解构为auth并检查其是否正确：

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