React useEffect 刷新没有得到值答案

【问题标题】：React useEffect refresh does not get valueReact useEffect 刷新没有得到值
【发布时间】：2020-06-07 13:04:34
【问题描述】：

大家好

我正在尝试获取钩子和 useEffect，但我无法理解某些内容。我的代码是这样的：

function RedigeraProdukter() {


    //fetches redux
    const products = useSelector(state => state.products)


    //set local states
    const [product, setProduct] = useState(
        queryString.parse(window.location.search).prod
    );

    useEffect(() => {
        setProduct(queryString.parse(window.location.search).prod);
    }, [queryString.parse(window.location.search).prod]);

假设当用户获取到此页面的链接时，一个 prop 作为查询字符串传递，该字符串分配给产品。我使用了 useEffect 钩子来实现这个效果，但是，如果我刷新页面，useEffect 不会读取道具并且产品变得未定义。

有什么解决办法吗？？？

【问题讨论】：

如果你的 useEffect 依赖数组是 [product] 会发生什么？
在刷新页面上获取未定义

标签： reactjs react-native react-hooks

【解决方案1】：

useEffect 中的依赖项应该是 product 而不是 queryString.parse(window.location.search).prod。

function RedigeraProdukter() {

    //fetches redux
    const products = useSelector(state => state.products)

    //set local states
    const [product, setProduct] = useState("");

    useEffect(() => {
        setProduct(queryString.parse(window.location.search).prod);
    }, [product]);

}

【讨论】：

根本不起作用。这种方式产品总是未定义的。
产品的价值是第一次更新吗？
你能粘贴window.location的输出吗？
链接中的 window.location 表示要执行 Link to={'/producter/?k=' + a1} 其中 a1 将是一个变量查询字符串。当用户单击链接转到页面时，它的工作原理非常完美。问题是刷新时，它不会读取此查询字符串或将其设置为产品的值
@OblicionA 你在用反应路由器吗？

【解决方案2】：

试试这个：

useEffect(() => {
        setProduct(queryString.parse(window.location.search).prod);
    }, [window.location.search]); <-- changed

【讨论】：

我理解这个想法，但也不起作用。当它第一次登陆页面时，它会读取，但在刷新时会变得未定义。