chrome.storage에서 vue.js 데이터로 데이터로드

Question

크롬 앱을 제작 중이며 옵션 페이지에 Vue.js를 사용합니다. 크롬 저장 장치에서 설정을로드하고이를 vue 데이터에 넣기를 원합니다.

내 문제는 크롬 저장 콜백 내부에서 vue compontens에 액세스 할 수 없다는 것입니다. 콜백 내부에서 호출 할 때마다 모든 vue 요소는 정의되지 않습니다. 크롬 저장 cb 함수가 값을 반환하거나 여분의 콜백을 허용하는 방법이 있습니까?

여기에 내 코드 ES6 및 transpiling (선호 된 접근)를 사용하여

name: 'app', 
    data: function() { 
     return { 
      data [] 
     } 
    }, 
    methods: { 
     init: function() { 
      chrome.storage.sync.get('series', function (storageData) { 
       this.data = storageData //this is not possible, because this.data is undefined 
       }) 
      }); 
     } 
    }, 
    created: function() { 
     this.init(); 
    } 
} 

Answer 1

하는 경우입니다. 참고 : 화살표 함수는 새 컨텍스트를 만들지 않습니다.

init: function() { 
    chrome.storage.sync.get('series', storageData => { 
     this.data = storageData 
    }); 
} 

ES5는 해결 방법 :

init: function() { 
    var self = this; 
    chrome.storage.sync.get('series', function (storageData) { 
     self.data = storageData 
    }); 
}