Question

如果我的用户状态为true，我试图呈现一段文本。


{this.state.userStatus.data == "true" && <div><p>aasdasdasdasdsdasd</p></div>}

但是我收到错误消息无法读取未定义的属性“数据”

奇怪的是，如果我省略上面的代码，我可以控制台登录我的userstatus并说“ true”。

  componentDidMount() {
    this.getJobs();
    console.log
    this.getPeople();
    this.getUserStatus();
        return axios ({
            method: 'get',
            url: '/user',
            params: {},
            withCredentials: true
        }).then(result => {
          this.setState({ user: result.data }, () => {
            console.log("state in componentDidmount?", this.state.userStatus.data)
          });
        });
  }

  getUserStatus() {
    console.log("getuser status called")
    axios.get("/getUserStatus").then(result => {
      console.log("where my state at", this.state)
      this.setState({ userStatus: result.data }, () => {
          console.log("user status in getUserStatus(): ", this.state.userStatus.data)
   });
   });
}

发生了什么事？

Answer 1

将您的条件扩展到

{this.state.userStatus && this.state.userStatus.data == "true" && <div><p>aasdasdasdasdsdasd</p></div>}

Answer 2

state.userStatus在通话返回之前是不确定的。

Answer 3

尝试初始化您的状态

constructor(props) {
            super(props);
            this.state = {userStatus: {}};
        }

Answer 4

第一次尝试使用console.log（this.state.userStatus）检查state的值，并显示该值并显示它是否已更新且找到，并检查是否找到了该.state.userStatus检查this .state.userStatus.data ==“ true”，如果没有发现条件为false，则不会显示该文本，因为您使用并操作了第一个条件为true的内容，则不显示该文本

我可以用控制台记录我的状态，但仍然会收到“无法读取未定义的属性'data'”。为什么？

4 个答案: