Vue.js错误：TypeError: Cannot read properties of undefined。

Question

我的Vue.js知识有限，但据我所知，这应该是可行的。但出现问题了，当我尝试访问data属性中的变量时，它找不到它。

data: function() {
    return {
        id: 0,
        clients: []
    }
},
methods: {
    getClientData(){
        fetch('/view-clients/' + this.id).then(function (response) {
            return response.text();
        }).then(function (data) {
            this.clients = JSON.parse(data);
            this.id = this.clients[clients.length - 1].id;
        }).catch(function (error) {
            console.log('Error: ' + error);
        });
    }
}

- XxRoKeTfAcExX

---

笔误？应该是 this.clients[this.clients.length - 1].id。 - J. Titus

同时，由于您未使用箭头函数，因此适用函数作用域，所以 this 不是您想象的那样。 - J. Titus

即使应用了上述注释，如果期望它“工作”，并不取决于返回的解析结果。然而，并没有提供足够的信息来说明这到底是什么。也就是说，这个问题并没有代表一个完整的最小复制。 - user2864740

请使用箭头函数，否则您回调函数中的this将不会引用Vue组件实例。此外，clients未定义：您是否指的是this.clients[this.clients.length - 1].id？ - Terry

Answer 1

很可能是函数作用域导致的问题。使用箭头函数，使this指向Vue组件。

data() {
    return {
        id: 0,
        clients: []
    }
},
methods: {
    getClientData(){
        fetch('/view-clients/' + this.id).then((response) => response.text())
          .then((data) => {
            this.clients = JSON.parse(data);
            this.id = this.clients[this.clients.length - 1].id;
          }).catch((error) => {
            console.log('Error: ' + error);
          });
    }
}

- J. Titus