vue 2.x 提供了以下方法监听数组变化:1. v-for 指令;2. vue.set() 方法;3. .push()、.pop() 和 .splice() 方法;4. $watch() 方法(需设置 deep 选项为 true 以启用深度监视)。
Vue 2.x 中监听数组变化的方法
Vue.js 中提供了几种方法监听数组变化:
1. 使用 v-for 指令
v-for 指令会自动跟踪数组变化并更新 DOM。
立即学习“前端免费学习笔记(深入)”;
2. 使用 Vue.set() 方法
Vue.set() 方法可以设置数组中的特定索引,并触发数组变化的通知。
Vue.set(this.items, 0, '新项目');
3. 使用 .push()、.pop() 和 .splice() 方法
这些方法会修改数组,并自动触发数组变化的通知。
this.items.push('新项目'); this.items.pop(); this.items.splice(null, 1);
4. 使用 $watch() 方法
$watch() 方法可以监听特定数据的变化,包括数组。
watch: { items: { handler(val, oldVal) { // 在数组变化时执行函数 }, deep: true, }, },
注意: