javascript - 如何在弹出窗口中显示存储数据？

Question

编辑：我在这里找到了我的解决方案：Returning Chrome storage API value without function

我目前正在构建一个 chrome 扩展，并想使用存储数据。我设法保存了它，即使第二天它仍然存在。所以这部分工作有效。但我想在弹出窗口中显示我保存的数据。
假设我希望用户输入他们的姓名并存储该姓名。然后我希望弹出窗口更新并显示“欢迎 {name}”。我该怎么做？

我写了这段代码，但它什么也没做。

popup.js

const generateLinks = document.getElementById("generate-links");
const data = document.getElementById("data-token");
const form = document.getElementById("data-form");
const content = document.getElementById("content");
const textData = document.getElementById("saved-data-token");

let token = "";
let savedData = "";

function hasData() {
  if (savedData !== "") {
    textData.innerHTML = "Your data is: " + savedData;
  }
}

hasData();

form.addEventListener("submit", (e) => {
  e.preventDefault();
  console.log(data.value);
  token = data.value;
  chrome.runtime.sendMessage(token, (response) => {
    savedData = response;
  });

  content.classList.add("accepted");
});

我显然一定做错了什么，有人可以指导我找到正确的解决方案吗？

我用以下内容更新了代码，现在得到了undefined，但是当我 console.log 它而不是 return 时，我确实得到了数据。

let savedData = chrome.storage.sync.get(["data"], (res) => {
  return res.data;
});

标签： javascriptgoogle-chrome-extension