javascript - 使用 localStorage 保存 Google 地图和行车路线

Question

我正在尝试将 localStorage 与 Google 地图一起使用，以将开始、结束和行车路线保存到本地存储，以便在关闭活动浏览器窗口后保留用户输入。我很确定我可以在这里添加功能：

function calculateAndDisplayRoute(directionsService, directionsRenderer) {
  var start = document.getElementById("start").value;
  var end = document.getElementById("end").value;
  directionsService.route(
    {
      origin: start,
      destination: end,
      travelMode: "DRIVING",
    },
    function (response, status) {
      if (status === "OK") {
        directionsRenderer.setDirections(response);
      } else {
        window.alert("Directions request failed due to " + status);
      }
    }
  );
}

我在上面的函数中嵌套了这个函数：

function showData() {
  localStorage.setItem("startData", JSON.stringify(start));
  localStorage.setItem("endData", JSON.stringify(end));

  var sData = localStorage.getItem("startData");
  var eData = localStorage.getItem("endData");

  var sObject = JSON.parse(sData);
  var eObject = JSON.parse(eData);
}

我没有看到任何 JavaScript 错误，并且使用开发人员工具我可以看到正在写入本地存储的项目。但是，当我重新加载或关闭选项卡时，即使写入了本地存储值，用户选择也会重置。

刷新应用程序时，如何使用户选择保持不变？

标签： javascriptgoogle-maps-api-3

Answer 1

感谢大家。我想到了。我能够通过这个循环得到我需要的东西：

if (
    first &&
    localStorage.getItem("startData") &&
    localStorage.getItem("endData")
  ) {
    start = localStorage.getItem("startData");
    end = localStorage.getItem("endData");
  } else {
    start = document.getElementById("start").value;
    end = document.getElementById("end").value;
  }