如何在componentDidUpdate中设置2个条件？

Question

如何在componentDidUpdate中的“ if”语句中创建2个条件。这是我的代码：

componentDidUpdate(prevProps, prevState) {
    if (
      prevState.address_id !== this.state.address_id &&
      prevState.whoIsMetting !== this.state.whoIsMetting
    ) {
      console.log("hello")

    }
  } 

它不会触发任何事件，但是如果我分别使用它们，它将运行正常。我需要同时检查两个语句。可以在componentDidMount中设置2个条件，还是有其他方法？

Answer 1

如果两个都需要，可以将它们链接起来：

componentDidUpdate(prevProps, prevState) {
    if (prevState.address_id !== this.state.address_id){
           if( prevState.whoIsMetting !== this.state.whoIsMetting){
                // do stuff if both true;
           } else {
             // do stuff if first true and second false
           }
      } else {
          // do stuff if first false
      }
}

Answer 2

您的问题出在您的if的逻辑上，而不是语法上。您可以在componentDidMount内编写任何有效的JavaScript，因为它只是一个与其他函数一样的函数。

编写两个if函数，如下所示：

if (prevState.address_id !== this.state.address_id)
...
if(prevState.whoIsMetting !== this.state.whoIsMetting) 
...

与使用&&运算符同时检查两个语句有很大不同。 &&都必须为真。如果您想要一种方法来检查它们两者并获得与使用两个ifs相同的结果（如上），那么：

if (
      prevState.address_id !== this.state.address_id ||
      prevState.whoIsMetting !== this.state.whoIsMetting
    ) 

将要完成这项工作，因为您要检查一个OR另一个为真。

Answer 3

如果您使用过&&，则两个条件都为true时，条件将为true；否则，如果您要执行其中一个条件为true的语句，则可以使用||。

如果您的状况

prevState.address_id !== this.state.address_id

是真的，它将检查

prevState.whoIsMetting !== this.state.whoIsMetting

但是如果第一个条件为假，它将不检查第二个条件，并且将直接返回false。