关于API这东西，前端各个框架都是不同的，且都经常更新，不用死记，所以本篇博客记录一下Vue中业务上常用的API（稍复杂些的API，简单的略）
Vue中的数组操作
循环
<ul> // FAQ: key值一般不取index（数组下标值） 取唯一的id值 //（若一个页面有多个数组，index会有多个，key值则失去了唯一性） <li v-for="(item, index) in list" :key="item.id">{{item.name}}</li> <ul>
改变数组值
list:['a','b','c']; // 此为data中的数组 list[0] = 'aa'; // 此种修改是无效的，UI界面不会重新渲染 这是应该注意的 // 正确的姿势 通过调用 $set(array, index, value) // 传参：1. 要操作的数组 2. 下标值 3. 修改的值 this.$set(this.list, 0, 'aa'); // 或 Vue.$set(this.list, 0, 'aa');
- 对象数组元素交换位置（适用于业务上的，列表交换和上下移动）
list:[ { id:1, name: '小明', }, { id:2, name: '小红', }, { id:3, name: '小绿', }, ] // 上下移动 function changeSort(type, index){ let tempArray; // 上移 if(type == 'up'){ // 搞个临时数组接收一下 tempArray = this.list[index-1]; // 交换 this.$set(this.list, index-1,this.list[index]); this.$set(this.list, index, tempArray); }else{ tempArray = this.list[index + 1]; this.$set(this.list, index + 1,this.list[index]); this.$set(this.list, index, tempArray); } } // 随机调换也是一样的，传index就可以了 // ...代码略
- 删除数组元素
this.$delete(this.list, index); // index 下标值
Vue中的对象操作
obj: { name: '猪小明', age: 18, class: '三年二班' }
- 修改
this.$set(this.obj, 'name', '王八蛋'); // obj 中的 name 从 “朱小明” 变成了 “王八蛋”
- 删除
this.$delete(this.obj, "age"); // obj中的age没得了
