步进器本地存储显示不同步进器的不同状态

Question

• 我尝试将本地存储和会话存储应用于步进器。
• 当我按下第一步的下一步按钮时，存储值应更新为完成状态。
• 因此在 VerticalLinearStepper.js 文件中，我在此方法 handleNext 中添加了存储。
• 但未添加。
• 然后再访问此页面https://jpvfy.codesandbox.io/anotherPage，则需要从该页面获取存储值。
• 我调试了控制台并将其放入此方法的句柄中，然后将其设置为打印控制台。
• 你能告诉我如何解决它吗？
• 在下面提供我的沙盒和代码段。

VerticalLinearStepper.js

handleNext = (e, storageType) => {
    console.log("handleNext--->");

    if (!storageType) return; // do nothing if no value to work with
    if (storageType === "local") {
      console.log("window ---> local");
      // another tab asked for the sessionStorage -> send it
      localStorage.setItem(
        "sessionStorage",
        JSON.stringify({ sessionStorage })
      );
      // the other tab should now have it, so we're done with it.
      //localStorage.removeItem("sessionStorage"); // <- could do short timeout as well.
    } else if (storageType === "session") {
      console.log("window ---> session");
      // another tab sent data <- get it
      sessionStorage.setItem("step1Completed", "step1Completed");
      var data = JSON.parse(storageType);
      for (var key in data) {
        sessionStorage.setItem(key, data[key]);
      }
    }
    console.log("localStorage", localStorage.getItem("sessionStorage"));
    console.log("session storage", sessionStorage.getItem("step1Completed"));
    //listen for changes to localStorage
    if (window.addEventListener) {
      console.log("window --->");
      window.addEventListener("storage", "xxx", false);
    } else {
      console.log("window --->");
      window.attachEvent("onstorage", "xxx");
    }

    // Ask other tabs for session storage (this is ONLY to trigger event)
    if (!sessionStorage.length) {
      localStorage.setItem("getSessionStorage", "foobar");
      localStorage.removeItem("getSessionStorage", "foobar");
    }

    if (this.canGoForward()) {
      this.setState(prevState => ({ activeStep: prevState.activeStep + 1 }));
    }
  };

pageOne.js

<!-- language-all: lang-or-tag-here -->



 completedState = (e, storageType) => {
    console.log("localStorage", localStorage.getItem("sessionStorage"));
    console.log("session storage", sessionStorage.getItem("step1Completed"));
  };