标签：method user type object iter file 使用 turn ext
变异方法：会改变原始数组
非变异方法：不会改变原始数组，但是会返回一个新数组
vue不能检测变动的数组
利用索引值直接设置内容时 vm.items[indexOfItem] = newValue；
修改数组的长度时 vm.items.length = newLength；
//这种写法并不能实时检测到变化 var vm = new Vue({ data: { items: [‘a‘, ‘b‘, ‘c‘] } }) vm.items[1] = ‘x‘ vm.items.length = 2 //下面方法可以实时触发更新刷新 // Vue.set Vue.set(vm.items, indexOfItem, newValue) // Array.prototype.splice vm.items.splice(indexOfItem, 1, newValue) vm.items.splice(newLength)
vue不能检测对象属性的添加和删除
// 不是响应式的，不能检测到变化 var vm = new Vue({ data: { a: 1 } }) vm.b = 2 //实时响应的 var vm = new Vue({ data: { userProfile: { name: ‘Anika‘ } } }) //添加age属性 Vue.set(vm.userProfile, ‘age‘, 27) vm.$set(vm.userProfile, ‘age‘, 27)
为已有对象赋予多个新属性 可以使用Object.assign() 或_.extend()
vm.userProfile = Object.assign({}, vm.userProfile, { age: 27, favoriteColor: ‘Vue Green‘ })
数组的过滤和排序 如果我们想要一个数组过滤或排序后的数据，并且不改变原始数组，可以使用计算属性
例：
<li v-for="n in evenNumbers">{{ n }}</li>
data: { numbers: [ 1, 2, 3, 4, 5 ] }, computed: { evenNumbers: function () { return this.numbers.filter(function (number) { return number % 2 === 0 }) } }
如果计算属性不适合用，还可以使用method方法
<li v-for="n in even(numbers)">{{ n }}</li>
data: { numbers: [ 1, 2, 3, 4, 5 ] }, methods: { even: function (numbers) { return numbers.filter(function (number) { return number % 2 === 0 }) } }
参考地址：https://cn.vuejs.org/v2/guide/list.html#%E5%8F%98%E5%BC%82%E6%96%B9%E6%B3%95
标签：method user type object iter file 使用 turn ext
原文地址：https://www.cnblogs.com/zsj-02-14/p/10483759.html
