Question

因此，我有一个sidenav，其中有打开的扩展面板。我正在设置打开扩展面板的state。但是单击sidenav之一后，我将重定向到列表项路径，并且sidenav返回到原始state。对于重定向，我希望在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成为所有处理程序中的最后一个表达式。

设置会话存储并从中获取状态反应

1 个答案: