javascript - 如何为 chrome 扩展设置一个简单的动态变量到 chrome.storage.local.set 中？

Question

我有一个 slider ，我希望能够将值设置到本地存储中，以便我可以在网页上动态使用该值。

我需要帮助的部分是chrome.storage.local.set(v);。

$('#slider').on('change', function () {
    var v = $(this).val();
    $( 'div').each(function () {
        this.style.setProperty( 'margin', '10px '+v+'px', 'important' );
    });
    chrome.storage.local.set(v);
});

该变量工作完美，我只需要能够将其保存到本地存储中，以便我可以使用它。它在页面重新加载之前工作，所以我现在需要的就是能够将其放入存储中，以便在重新加载该页面时保存该值。

<小时/>

更新:这就是你所说的吗？

$('#slider').on('change', function () {
    var v = $(this).val();
    var theKeyForV = chrome.storage.local.get({"keyforv" : v}, 
    chrome.storage.local.set({"keyforv" : v}, 
    function(){ 
        // callback (what goes here?)
    });
    $( 'div').each(function () {
        this.style.setProperty( 'margin', '10px '+theKeyForV+'px', 'important' );
    });
});

Answer 1

您可以使用这种方式:

// Set
var dataObj = {};
dataObj["key1"] = "vaule1";
// dataObj["key2"] = "vaule2"; // if you want to set value more than one key.
chrome.storage.local.set(dataObj, function() {
  if(!chrome.runtime.lastError){
      // set storage value successfully.
  }
});

// Get
var dataObj = ["key1"];
// var dataObj = ["key1", "key2"]; // if you want to get value more than one key. 
chrome.storage.local.get(dataObj, function (callback){
   if(callback && callback["key1"]){
     // To Do: handle callback["key1"].
    }
});

// Remove
var dataObj = ["key1"];
// var dataObj = ["key1", "key2"]; // if you want to remove value more than one key.
chrome.storage.local.remove(dataObj, function(callback) {
   if(!chrome.runtime.lastError){
      // remove successfully.
  }
});

要了解更多信息，请参阅chrome.storage