由于状态而在错误的时间弹出模态

Question

所以我有两个我正在使用的模态，其中一个已经实现并且表现符合预期但是当我根据 if there is any true value when mapping over the array 的条件添加另一个模态时它现在的工作方式当有 true 值时，模态显示。我认为这是因为在 true 出现之前从我的 .includes() 函数返回了多个 false 值。我认为一个很好的解决方案是当我在条目上运行 .includes() 时将返回的所有值组成一个数组然后我可以检查该数组是否有任何 true 值但我不能似乎将值放入数组中。当我尝试将它们推入一个数组时，它们只是全部推入自己单独的数组。这可能是错误的方法，如果是的话，您能解释一下更好的方法是什么吗：

const checkPending = () => {
    if(entries){
      entries.map(descriptions => {
        const desc = descriptions.description
        //check if there are any pending tests
        const check = desc.includes("pending")
       //if the check returns true show the pending modal if it doesnt set the other modal to true
        if(check === true){
          setShowModal(false)
          setShowPendingM(true)
         
        }else{
          setShowModal(true)
        }
      })

    }
  }

    return(
         <Button
          onClick={() => checkPending()}
          className={`${styles.headerButton} mr-2`}
           >
          Add File&nbsp;&nbsp;
          <Plus />
        </Button>
)

setShowModal & setShowPendingM 都是作为 props 从父组件传递过来的。它们都被初始化为false。我能提出的最直接的问题是 is there any way to say if there are any true values returned from .includes then do something even if there are false values present

Answer 1

我认为这就是您的 checkingPending 方法的样子。

const checkPending = () => {
    if(entries){
      let pending = false;
      entries.forEach((descriptions) => {
        const desc = descriptions.description
        if(desc.includes('pending')){
            pending = true;
        }
      });
      if(pending) {
          setShowModal(false);
          setShowPendingM(true);
      } else {
          setShowModal(true);
          setShowPendingM(false);
      }
    }
  }

如果您有任何其他问题，请告诉我。

由于状态而在错误的时间弹出模态

Modal popping up at the wrong time due to state

state

include

reactjs