Question

州

  const [searchTerm, setSearchTerm] = useState("");
  const [URL, SetURL] = useState<URL | String>();
  const [searchResults, setSearchResults] = useState([]);

resetSearch功能

  const resetSearch = () => {
    setSearchTerm("");
    setSearchResults([]);
    inputRef.current.value = ""
  }

重置查询功能

  const resetSearchQueryOnRouteChange = () => {
    SetURL(window.location.href)
    if (window.location.href != URL) {
      resetSearch();
    }
  }

useEffect

  useEffect(() => {
    resetSearchQueryOnRouteChange()
  }, [window.location.href, URL])

问题是我需要在每个路由渲染器上运行resetSearchQueryOnRouteChange()函数，但是当我更改路由时，不会调用该函数，但是该函数本身是完全可用的。

更改路由/ URL时如何运行该功能？

Answer 1

如果您不使用“反应路由器”，则每次更改位置都会触发整个页面的重新渲染。因此，该代码块将不会执行。您需要开始使用“反应路由器” and you'll get access to location

useEffect不会在路线更改时重新呈现

1 个答案: