使用相同的数据更新React useState状态以触发useEffect

时间:2019-12-12 23:59:42

标签: react-hooks use-effect

我有一个用React钩子编写的过滤器栏。它具有两个日历弹出窗口,用于选择开始日期和结束日期。开始日期和结束日期会自动更新useState挂钩。过滤器栏还有一个文本搜索,仅在单击按钮时提交。

当我单击文本搜索上的提交按钮时,我想按开始日期和结束日期以及文本字段过滤上下文变量。我的问题是,使用useEffect进行更改并在上下文上调用reducer操作不起作用。我只想在单击“提交”按钮时进行过滤,但是我发送到useState挂钩的文本变量有时为null,有时与上次相同。当文本更改时,UseEffect只会注册我单击了“提交”按钮。

我的代码看起来像这样:

  const [searchValue, setSearchValue] = useState(null)

  const searchByChars = (text) => {
    console.log("SEARCH TRIGGERED", text)
    setSearchValue(text)
    resetData()
  }

  const filter = data => {
     //The filtering
  }


  useEffect(() => {

    if (data) {
      dataContext.dataDispatch({type: SET_ACCOUNTS, payload: data})
    }
    if (searchValue) {
      filter(dataContext.dataState.data)
    }
  }, [
    data
    searchValue,
  ])

searchByChars由子组件调用。

如何重新触发useEffect来重新触发过滤器?

0 个答案:

没有答案