在 setState 不起作用后，Reactjs 將值作為道具傳遞

Question

當用戶單擊打開時，我試圖通過道具將對象傳遞給模態。 我從被點擊的行接收值，但我的模式無法從this.props讀取值，我得到一個未定義的值。 我正在正確設置狀態值並將其傳遞給模態組件。

模態調用

<Modal toggleModal={this.toggleModal} show={this.state.isOpen}
          onClose={this.toggleModal} user={this.state.user} />

設置狀態值

toggleModal = (user) => {
var userData = {};
if (user !== null) {
  userData = user
}
this.setState({
  isOpen: !this.state.isOpen,
  user: userData
},()=>{
  console.log('User data changed');
})
}

在模態組件的渲染部分內部

if (this.props.user === null) {
  userFound = 'Not found'
}
console.log(this.props.user);

在模態組件內部時，我未定義。 在此之前的任何地方我都得到了用戶對象。

謝謝

Answer 1

在您的組件內部，您只是檢查 null 而不是undefined ，如果您想檢查 undefined ，其中一種方法是使用typeof

typeof user !== "undefined"

所以它會像（如果你想檢查兩者或一個，你可以相應地修改它）：

toggleModal = (user) => {
  var userData = {};
  if (typeof user !== "undefined" && user !== null) {
  userData = user
}

你可以在 if block移動this.setState

toggleModal = (user) => {
    if (typeof user !== "undefined" && user !== null) {
      this.setState({
        isOpen: !this.state.isOpen,
        user: user
     })
    }
}