Question

我正在尝试使用jwt进行身份验证。我有一个登录表单，通过动作创建器向其他API发送ajax请求。其余API要么返回带有令牌的http400或用户对象。在我的网站标题中，我想显示用户的用户名，如果该用户已登录。如果用户登录，则令牌将处于应用程序状态（我知道，这不是令牌最安全的地方）。

但是，我似乎无法引用令牌，因为每当用户未登录时它都是未定义的。所以问题：如果它还不存在，我如何引用一段状态呢？

标题示例：

class Header extends Component {

    render() {
      return (
        <div>{this.props.auth.user.email}</div>
      );
    }
  }

  function mapStateToProps(state) {
    return { auth: state.auth };
}

export default connect(mapStateToProps) (Header);

我试过了：

if {!this.props.auth.user.name}

还有：

if {this.props.auth.user.name === undefined}

由于未定义变量，因此无法渲染两者。

我打赌一百万初学者之前有同样的问题，但我找不到通过搜索的解决方案。对不起。

Answer 1

如果props.auth是假的，你可以使用早期的回报：

render() {
  if (!this.props.auth) {
     return null;
  }
  return (
    <div>{this.props.auth.user.email}</div>
  );
}

参考未定义状态？

1 个答案: