chrome.storage.local得到回报“不确定”

Question

我想通过chrome.storage.local.get从Chrome中存储2个值（），但如果我尝试从回调函数返回值，我得到“未定义”。如果我CONSOLE.LOG（），它们将被实际登录。这是为什么？我读过一些其他职位，我需要使用回调 - 但据我基本了解JS去，我已经从中获取的回调frunction返回值（）。

// this should load 2 keys from an object stored in chrome storage
function loadJiraUrlElements(){
    chrome.storage.local.get({companyName: '', jiraBaseUrl: ''}, function(items) {
        return (items.companyName + items.jiraBaseUrl);
     })
}

// I want to use this function to call the return value and populate a DOM element
function populateUrlFieldsWithUrlElements(){
    companyInput.value = loadJiraUrlElements()
}

Answer 1

这是一个async功能，您可以把它包装一个承诺对象下或继续使用回拨机制。

1）承诺：

function loadJiraUrlElements() {
    return new Promise(function(resolve, reject) {
        chrome.storage.local.get({companyName: '', jiraBaseUrl: ''}, function(items) {
            resolve(items.companyName + items.jiraBaseUrl);
         })
    });
}

// And caller function changes to 
function populateUrlFieldsWithUrlElements(){
    loadJiraUrlElements().then(function(value) {
        companyInput.value = value;
    })
}

2）回调：

function loadJiraUrlElements(cb){
    chrome.storage.local.get({companyName: '', jiraBaseUrl: ''}, function(items) {
        cb && cb(items.companyName + items.jiraBaseUrl);
     })
}

function populateUrlFieldsWithUrlElements(){
    loadJiraUrlElements(function(value) {
        companyInput.value = value;
    })

}

Answer 2

你得到undefined因为你返回到回调函数（即内部函数），而不是外部函数，您正在试图从返回值。

您可以使用resolve一个承诺，所以你可以使用.then回调在populateUrlFieldsWithUrlElements功能得到你想要的值：

function loadJiraUrlElements() {
  return new Promise(resolve => {
    chrome.storage.local.get({companyName: '', jiraBaseUrl: ''}, function(items) {
      resolve(items.companyName + items.jiraBaseUrl);
    })
  })
}

// I want to use this function to call the return value and populate a DOM element
function populateUrlFieldsWithUrlElements() {
  loadJiraUrlElements().then(result => {
    companyInput.value = result;
  })
}

或者你可以使用async / await在你的第二个功能，如果你不希望使用.then回调：

// I want to use this function to call the return value and populate a DOM element
async function populateUrlFieldsWithUrlElements() {
  companyInput.value = await loadJiraUrlElements();
}