如何在 reactjs 中正确定义三元运算？

Question

我正在尝试制作一个功能如果 X 为真，则调用 setFalse 函数 ELSE 不调用 setFalseFunction    this.state = {      X: true,      Y: true,      Z: true,    };  }  setFalse() {    this.setState({      X: true ? this.setState.setFalse() : !this.setState.setFalse()),      Y: true ? this.setState.setFalse() : !this.setState.setFalse()),      Z: true ? this.setState.setFalse() : !this.setState.setFalse())    });  }但这似乎不起作用，我也试过 X = true？而不是 X: true?，仍然没有运气。

Answer 1

如果你想这样做 - > “如果 X 为真，那么调用 setFalse 函数，否则不要调用 setFalseFunction”

那么你不需要setState任何东西，因为你没有改变变量（X，Y，Z）的状态！您想简单地验证它们是否为真，如果是，您想调用该函数setFalse，对吗？

你可以通过简单地做到这一点，例如：

class App extends React.Component {

  state = {

    X: true,

    Y: true,

    Z: true,

  }

  setFalse() {

    console.log('I was called')

  }

  render() {

    const {X} = this.state

    return <div>{ X ? this.setFalse() : null }</div>

  }

}

现在，如果您想调用 setFalse 并更改变量的状态，那么您需要进入您的函数并执行以下操作：

  setFalse() {

    console.log('I was called')

    this.setState({

      X: false,

    })

  }

打开您的开发工具并查看状态变化，这里有一个示例

我建议你看看React 中的生命周期并研究它