无法在函数中设置undefined的属性

时间:2018-09-10 21:47:29

标签: javascript vue.js undefined typeerror

我正在使用vue在扩展程序的登录页面上设置错误消息,并且在importCreds()函数中出错。

data(){
    return {
    url:'',
    apikey:'',
    error:'',
    }
},
methods:{
    accountSummaryButton(){
        if (localStorage.getItem("accounts") == null)
            this.error = 'There are no available accounts.';
        }
        else
            // STUFF
    },
    saveLogin(event){
        let app = this;
        if (!app.getAccountData(app.url,app.apikey,this.method))
            this.error = 'An error has occurred, please check Url and API Key.';
        else {
            //STUFF
        }
    },
    importCreds(){
        let app = this;
        chrome.tabs.query({active: true, currentWindow: true}, function(tabs){
            chrome.tabs.sendMessage(
                tabs[0].id,
                {action: "import_creds"},
                function(response) {
                    if (response){
                        app.url = response.affiliateurl
                        app.apikey = response.apikey
                    } else
                        this.error = 'Go to your affiliate site.';
                }
            );
        });
    },
},

我是否缺少在该函数中访问error的简单方法?

1 个答案:

答案 0 :(得分:3)

importCreds仍然引用原始的this,但是chrome.tabs.query({}, function(tabs) {})不是。您可以通过将this分配给变量e.g. (let app = this),然后使用app.error来保留该引用。

data () {
    return {
      url: '',
      apikey: '',
      error: '',
    }
},
methods: {
    accountSummaryButton () {
        if (localStorage.getItem("accounts") == null) {
            this.error = 'There are no available accounts.';
        } else {
            // STUFF
        }
    },
    saveLogin (event) {
        let app = this;

        if (!app.getAccountData(app.url,app.apikey,this.method)) {
            this.error = 'An error has occured, please check Url and API Key.';
        } else {
            // STUFF
        }
    },
    importCreds () {
        let app = this;

        chrome.tabs.query({ active: true, currentWindow: true }, function(tabs) {
            chrome.tabs.sendMessage(
                tabs[0].id,
                { action: "import_creds" },
                function(response) {
                    if (response) {
                        app.url = response.affiliateurl
                        app.apikey = response.apikey
                    } else {
                        app.error = 'Go to your affiliate site.';
                    }
                }
            );
        });
    },
},