我在尝试使用popup.js方法将一个变量从内容脚本传递到sendMessage时遇到了很多困难。

这是内容脚本，我在其中向包含DOM节点的子节点数的后台脚本发送消息：

代码语言：javascript

复制

let incomingChatsNumber = incomingChatsContainer.children().length;chrome.runtime.sendMessage({ incomingChatsNumber: incomingChatsNumber });

然后，background.js侦听消息，并使用相同的变量向popup.js发送消息：

代码语言：javascript

复制

chrome.runtime.onMessage.addListener(function (message, sender, sendResponse) {
  let incomingChatsNumber = message.incomingChatsNumber;
  chrome.runtime.sendMessage({ incomingChatsNumber: incomingChatsNumber });});

在popup.js中，我有一个按钮，如果"incomingChatsNumber“大于0( dom容器有子元素)，该按钮将触发一些代码：

代码语言：javascript

复制

  $("#js-toggleSorting").on("click", function () {
    chrome.runtime.onMessage.addListener(function (message) {
      let incomingChatsNumber = message.incomingChatsNumber;
      if (incomingChatsNumber <= 0) {
        $(".message").html("<p>No Chats To Sort, You Joker</p>");
      } else {
        $(".message").html("<p>Sorting Chats</p>");
        //This code never gets executed
        if ($("#js-toggleSorting").attr("data-click-state") == 1) {
          $("#js-toggleSorting").attr("data-click-state", 0);
          $("#js-toggleSorting").html("SORT INCOMING CHATS");
          sortFunction(false);
        } else {
          $("#js-toggleSorting").attr("data-click-state", 1);
          $("#js-toggleSorting").html("STOP SORTING INCOMING CHATS");
          sortFunction(true);
        }
        save_button_state();
      }
    });
  });

对我来说，奇怪的是，popup.js得到了正确的值，我甚至可以console.log它，但是一旦我将更多的代码放在这个值上，如果有条件的话，即使条件允许，代码也永远不会被执行。

更新：

在做了ehab建议的修改之后，我意识到由于chrome.runtime.onMessage.addListener的异步特性，变量一直是“未定义的”：

内容脚本：

代码语言：javascript

复制

  let incomingChatsNumber = incomingChatsContainer.children().length;
  chrome.runtime.sendMessage({ incomingChatsNumber: incomingChatsNumber });

Background.js：

代码语言：javascript

复制

chrome.runtime.onMessage.addListener(function (message) {
  let incomingChatsNumber = message.incomingChatsNumber;
  chrome.runtime.sendMessage({ incomingChatsNumber: incomingChatsNumber });});

Popup.js (我需要在这里使用incomingChatsNumber变量的值)：

代码语言：javascript

复制

  let latestIncomingChatsNumber;

  chrome.runtime.onMessage.addListener(function (message) {
    let incomingChatsNumber = message.incomingChatsNumber;
    latestIncomingChatsNumber = incomingChatsNumber;
    //This Works
    console.log(latestIncomingChatsNumber);
  });
  //This will give me an undefined value
  console.log(latestIncomingChatsNumber);

我知道我的问题与以下事实有关: chrome.* API是异步的，所以chrome.runtime.和console.log(.)将同时执行，因此出现错误。那么，如何在单击事件中使用latestIncomingChatsNumber变量呢？我必须先将"latestIncomingChatsNumber“保存到chrome.runtime.onMessage.addListener内部的本地存储区吗？