我已经开始从零开始学习 VueJS。我正在关注他们的官方指南。但我被困在这里:https://v2.vuejs.org/v2/guide/#Handling-User-Input
在这个例子中...
var app5 = new Vue({
el: '#app-5',
data: {
message: 'Hello Vue.js!'
},
methods: {
reverseMessage: function () {
this.message = this.message.split('').reverse().join('')
}
}
})
.. message
属性是如何在不引用 data
对象的情况下被直接访问的?如果 this
关键字引用当前的 Vue 实例,是否应该像这样访问 message
属性:this.data.message
?
考虑以下示例:
({
name: "John Doe",
data: {
message: "Hello World"
},
greet: function(){
console.log("I am " + this.name);
console.log("I have a message for you: " + this.data.message); //see here
}
}).greet();
这就是我在 vanilla javascript 中访问属性的方式。有人可以让我了解幕后发生的事情吗?
最佳答案
从中我们得到“Vue 实例的数据对象。Vue 将递归地将其属性转换为 getter/setter 以使其具有“ react 性”。”这意味着 data
对象属性中的所有内容都直接应用于新的 Vue
。这使得这些属性在 this
上作为 getter 和 setter 可用。
关于javascript - 理解Vue中的 'this'关键字,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43505736/