1.关于使用watch监听函数的报错注意点
属性:Vue.js 监听属性 watch,我们可以通过 watch 来响应数据的变化。
代码:
export default {
name: 'HelloWorld',
props: {
msg: String
},
data() {
return {
site: "菜鸟教程",
url: "www.runoob.com",
alexa: 1
}
},
methods: {
details: function () {
return this.site + " - 学的不仅是技术,更是梦想!";
},
watch: {
'alexa': {
handler(nval, oval) {
console.log("b.c: " + nval, oval);
},
deep: true //true 深度监听
}
}
}
}
报错截图:
报错好像是说watch在引用组件中定义了是对象类型,是否要引用进来
我按照网上的教程复制代码进来还是提示这个错误信息, 后面想想好像我的watch方法的位置不太一样,于是就调整watch方法到methods方法前面去,就不会报错了,程序顺利运行下去
正确代码:
export default {
name: 'HelloWorld',
props: {
msg: String
},
data() {
return {
site: "菜鸟教程",
url: "www.runoob.com",
alexa: 1
}
},
watch: {
'alexa': {
handler(nval, oval) {
console.log("b.c: " + nval, oval);
},
deep: true //true 深度监听
}
},
methods: {
details: function () {
return this.site + " - 学的不仅是技术,更是梦想!";
},
}
}
运行效果: