在Vue中,data属性在组件生成时就会被初始化为响应式属性对象,而在return中定义的属性并不是响应式的,因此在return中直接使用this
关键字是无法访问到 data 定义的属性的。
如果希望在 return 中使用 data 中定义的属性时,可以在data函数中定义一个变量来代替,例如:
data () {
let typeName = '11'
return {
typeName,
label: typeName + '名称'
}
}
这样定义的变量可以在 return 中使用。另外,如果需要在组件中修改这个值,可以通过 this.typeName 访问到 data 定义的 typeName 属性。
高亮 :vue中关于this的一些指向的问题,箭头函数和普通函数的this指向,可以参考这些博客