为什么我在本地存储中看不到上次单击的值？

Question

我正在创建一个 google chrome 扩展程序，但我在使用本地存储来保存我最后一次单击的按钮值时遇到了问题。我这样做是为了在我退出弹出窗口后继续显示最后单击的按钮。我觉得我快接近了，但出于某种原因，它不想在我退出弹出窗口后显示相同的按钮。我试过使用本地存储，所以最后一个值将被保存，所以按钮保持不变。

然而，当我在检查时转到应用程序 >> 本地存储时，我没有看到任何 lastclicked 值被保存在那里。

我可能做错了，但有人知道问题出在哪里吗？

//Start and Stop buttons for logging
const btnStart = document.getElementById("click-start");
const btnStop = document.getElementById("click-stop");


var lastClicked = document.getElementById("btnStartID");

//button to start/stop logging
document.addEventListener("DOMContentLoaded", function () {
    
    
    
    //get lastClicked first to make decisons
    chrome.storage.local.get(['lastClicked'], function(result) {
        
        if (result == document.getElementById("btnStartID")) {
            //works
            btnStart.style.display= "none";
            btnStop.style.display= "block";
             console.log("last clicked is start button");
            Logger(true);
        } else if (result == document.getElementById("btnStopID")) {
            //not working
            btnStart.style.display= "block";
            btnStop.style.display= "none";  
            Logger(false);
            console.log("last clicked is stop button");
        } else {
            //to see if its grabbing id elements
            console.log("else statement");
            Logger(true);
        }
        
        
     //works   
    btnStart.addEventListener("click", function() {
        lastClicked = document.getElementById("btnStartID"); 
        Logger(true);
        chrome.storage.local.set({'lastClicked': lastClicked}, function() {
            console.log('logging started successful');
    }); 
        });
     
    btnStop.addEventListener("click", function() {
        lastClicked = document.getElementById("btnStopID"); 
        Logger(false);
        chrome.storage.local.set({'lastClicked': lastClicked}, function() {
            console.log('logging stopped successful');
    });
        });
    
    
    });
    
});

chrome.storage.local.get(['key'], function(result) {
    console.log('value currently is ' + result.key);
});


//attempt to get start/stop logging buttons to work--underwork
function Logger(isLogging) {
    
        let logger =''
        if (isLogging){
        
        
        btnStart.style.display= "none";
        btnStop.style.display= "block";
        logger = 'logging' 
        addRow();
    } else {
        
        btnStart.style.display= "block";
        btnStop.style.display= "none";

        logger = 'not logging'
    }
    
    //using storage API to save data for last btn pressed--underwork
    chrome.storage.local.set({key: logger}, function() {
        console.log('value is set to  ' + logger);
    }); 
}

Answer 1

您只能将字符串保存到本地存储，因此 Chrome 会忽略您保存整个按钮的尝试，更好的解决方案是保存按钮 ID，因此您将拥有

if (result.lastClicked == "btnStartID") {
  ...
chrome.storage.local.set({'lastClicked': lastClicked.id}

为什么我在本地存储中看不到上次单击的值？

why cant I see my lastclicked values inside my local storage?

javascript

storage

button

local-storage

google-chrome-extension