как мне увеличить значение q на единицу без сброса при каждом открытии popup.js в расширении Chrome

#javascript #google-chrome-extension

#javascript #google-chrome-extension

Вопрос:

 var i = 300;
chrome.storage.sync.set({q:i},()=>{console.log(i);});
chrome.storage.sync.get(['q'],(q)=>{document.querySelector("#here").innerHTML = q.q;});
document.querySelector("body").addEventListener("click",()=>{
  i  ;
  chrome.storage.sync.set({q:i},()=>{var q = i;});
  chrome.storage.sync.get(['q'],(q)=>{document.querySelector("#here").innerHTML = q.q;})
},false);
  

q всегда обновляется до 300 при каждом открытии расширения как мне обновить его, а не сбросить,
есть ли способ сделать это без фоновой страницы и просто использовать popup.js ?

Комментарии:

1. На ваш вопрос было бы легче ответить, если бы вы немного прояснили его. Попробуйте добавить еще несколько деталей и контекста.

2. первоначально предполагается, что i равно 300, и после открытия всплывающего окна и щелчка число увеличивается на единицу, а после закрытия всплывающего окна и повторного открытия оно должно быть таким, каким было последнее число

3. Добро пожаловать в SO, то, что вы делаете, это объявляете переменную i = 300, то есть сбрасываете значение каждый раз. Одним из обходных путей является использование некоторой глобальной переменной или локального хранилища. Тогда вы можете вызывать и обновлять его каждый раз, а не создавать «i» каждый раз.

Ответ №1:

  1. Удалите вторую строку chrome.storage.sync.set({q:i},()=>{console.log(i);});
    он всегда перезаписывает хранилище, в i котором есть 300 .
  2. Прочитайте хранилище при запуске и поместите результат в i
  3. Прослушивание изменений в хранилище и автоматическое обновление i и DOM — это будет обрабатывать как ваши собственные изменения, так и удаленные изменения из-за синхронизации браузера или изменений во всплывающих окнах, открытых в других окнах браузера.
 let i;

chrome.storage.sync.get({q: 300}, res => {
  useValue(res.q);
});

chrome.storage.onChanged.addListener(changes => {
  if (changes.q) {
    useValue(changes.q.newValue);
  }
});

document.querySelector('body').addEventListener('click', () => {
  chrome.storage.sync.set({q: i   1});
});

function useValue(val) {
  i = val;
  document.querySelector('#here').textContent = val;
}
  

Комментарии:

1. что, если я хочу ввести его как вместо q: 300 q:i и i = 300;

2. Смотрите Учебные пособия по DOM — вы можете использовать input элемент и прослушивать input событие для этого элемента.

3. я видел, что расширение делает это через ввод, но мне было интересно, могу ли я просто ввести значение в js-файле как переменную, а не значение 300

4. Наверное, я неправильно понял ваш вопрос. Да, вы можете это сделать. Потенциальное преимущество этого способа заключается в том, что переменная не будет иметь неправильного значения до тех пор, пока не будет получен доступ к хранилищу.

5. хорошо, ваш ответ действительно помог тому, что я пытаюсь сделать, так что спасибо: D