刷新后如何保持状态答案

【问题标题】：How to keep the state even after refresh刷新后如何保持状态
【发布时间】：2021-03-23 07:39:10
【问题描述】：

我正在尝试将当前状态从一个页面传递到另一个页面，并且在我转移它时它可以工作。但是，新的问题是在新页面上保持当前状态。每次我刷新页面时，状态都会消失并不断收到错误消息“无法读取未定义的属性'状态'”。我尝试使用 Hooks 中的 useEffect，但它仍然不起作用。这是一步一步的代码：

我的产品页面：

<Grid container direction="row" justify="center" alignItems="center">
  {currentSearch.map((productObj) => {
    // console.log(productObj);
    return (
      <ProductResult
        name={productObj.name}
        price={productObj.price}
        style={productObj.style}
        type={productObj.type}
        depth={productObj.depth}
        height={productObj.height}
        width={productObj.width}
      />
    );
  })}
</Grid>

将传递给 ProductResult 组件：

<Link
  to={{
    pathname: '/product/description',
    infoObj: {
      text: 'This is information passed on',
      state: {
        ...props,
      },
    },
  }}
>
  Product Description
</Link>

然后转到产品说明：

const [loadInfo, setLoadInfoState] = useState('');
useEffect(() => {
  // loadDescrInfo();
  setLoadInfoState(props.location.infoObj.state);
}, []);
console.log(loadInfo);

非常感谢大家的任何建议或帮助。谢谢

【问题讨论】：

标签： javascript reactjs react-router state

【解决方案1】：

您需要将您的状态保存到localStorage 或sessionStorage，并且当组件挂载时，将值从存储传递到您的状态。了解 localStorage：https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage

【讨论】：