文章目录
- 一、语法介绍
- 二、添加代码
- 三、结果展示
- 四、参考文献
一、语法介绍
1、问题来源
我们在处理网页时,原有数组不能满足需求,需要去更新一个数组。
2、解决办法
-
push():给数组末尾添加元素,this.list.push(7,8,9);
-
pop():删除数组末尾的元素,this.list.pop();
-
shift():删除数组的第一个元素,this.list.shift();
-
unshift():给数组的首位添加元素,this.list.unshift(7);
-
splice():删除元素、插入元素、替换元素;
第一个参数:表示开始插入或开始删除的元素下标
删除元素, this.list.splice(1,3);
第二个参数:表示要删除几个元素(如果是没有参数,就删除后面所有元素);
插入元素,this.list.splice(1,0,7,8,9);
第二个参数:传入“0”,接上要插入的元素
替换元素,this.list.splice(1,3,7,8,9);
第二个元素:表示我们要替换几个元
-
sore():排序,this.list.sort();
-
reverse():翻转 ,this.list.reverse();
二、添加代码
javascript"><template><h3>数组动态监听</h3><button @click="addList">添加数据</button><ul><li v-for="(item,index) in names" :key="index">{{item}}</li></ul>
</template><script>
export default {data() {return {names: ["iwen", "ime", "frank"],};},methods:{addList(){// 引起ui自动更新// this.names.push("sakura");// 不会引起ui自动更新this.names.concat(["sakura"]);console.log(this.names.concat(["sakura"]));}}
};
</script>
三、结果展示
四、参考文献
[1] vue.js