watch-监视对象数据的变化
Posted congtt
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了watch-监视对象数据的变化相关的知识，希望对你有一定的参考价值。
//html准备
<div id="app">
<label for="userName">用户名：</label>
<input type="text" id="userName" v-model="userName">
<span v-show="isError">用户名长度为 6~12 个字符</span>
<p>
<input type="text" v-model="user.age">
</p>
</div>
// 监视的对象一定是data里的对象
data: {
user: {
userName: ‘‘,
age: 19
}
},
// 监视对象里的每一个数据的变化
watch: {
// 对象中任意一个属性变化了, 就触发下面的 handler 函数
// 数据变化时要执行的函数
user：{
handler (curVal, oldVal) {
if (curVal.userName.length < 6 || curVal.userName.length > 12) {
this.isError = true
} else {
this.isError = false
}
},
// 深度监听, 只要对象中属性变化了, 那么设置为true, 就可以监视到对象的变化了
deep: true,
// 立即去触发一次监视
immediate：true
}
}
// 监视对象里的一个属性的变化
vatch: {
‘user.age‘ (curVal, oldVal) {
}
}
以上是关于watch-监视对象数据的变化的主要内容，如果未能解决你的问题，请参考以下文章