vue2怎么监听数组的变化

百变鹏仔 3个月前 (10-29) #前端问答

文章标签数组

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(0, 1);

4. 使用 $watch() 方法

$watch() 方法可以监听特定数据的变化，包括数组。

watch: {  items: {    handler(val, oldVal) {      // 在数组变化时执行函数    },    deep: true,  },},

注意：

文章推荐