локальное хранилище степпера, показывающее разные состояния для разных степперов - PullRequest
0 голосов
/ 03 июня 2019
  • Я попытался применить локальное хранилище и хранилище сеансов к степперу.
  • при нажатии следующей кнопки хранилища первого шага значения должны быть обновлены до завершенного состояния.
  • поэтому в файле VerticalLinearStepper.js Я добавил хранилище в этот метод handleNext .
  • но это не добавление.
  • и потом, если я попаду на эту страницу https://jpvfy.codesandbox.io/anotherPage Мне нужно получить значения хранилища с этой страницы.
  • Я отлаживал и помещал консоль в этот метод handleNext это консоль печати.
  • подскажите, как это исправить.
  • предоставив мою песочницу и фрагмент кода ниже.

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"));
  };
...