javascript - 从 session 存储中设置和获取状态 react

Question

所以我有一个 sidenav，它具有可打开的扩展面板。我正在设置扩展面板打开的state。但是，单击其中一个 sidenav 时，我会被重定向到列表项路径，并且 sidenav 返回到原始状态。在重定向上，我希望 sidenav 的部分保持打开状态。我正在尝试这样做。我不知道为什么它不起作用。

 handleOpen = path => {
    this.setState({ openPath: path });
    sessionStorage.setItem('path', this.state.openPath);
  };

class Sidebar extends React.Component {
  constructor(props){
    super(props);
    let getPath = JSON.parse(sessionStorage.getItem('path'))
  this.state = {
    openPath: getPath
  };

  }

Answer 1

您至少应该展示该组件的使用方式，但乍一看:

sessionStorage.setItem('path', this.state.openPath);

需要

sessionStorage.setItem('path', JSON.stringify(this.state.openPath));

我也会颠倒这些行:

  handleOpen = path => {
    this.setState({ openPath: path });
    sessionStorage.setItem('path', this.state.openPath);
  };

至

  handleOpen = path => {
    sessionStorage.setItem('path', this.state.openPath);
    this.setState({ openPath: path });
  };

这应该不重要，因为 Javascript 是单线程的，但至少在风格上我喜欢将 setState 作为任何处理程序中的最后一个表达式。