问题描述:将data中数据列表渲染到页面,循环生成 el-switch ,点击页面中 el-switch 后数组中某项值改变,但是页面不更新
数据格式如下
export default{ data(){ list : [ { id : 1, selected : true, title : 'aaa' }, { id : 2, selected : false, title : 'bbb' }, { id : 3, selected : true, title : 'ccc' } ] } }
原因是因为 利用索引直接设置一个项值之后,Vue不能检测到数据变化 详情参考:https://cn.vuejs.org/v2/guide/list.html#%E6%95%B0%E7%BB%84%E6%9B%B4%E6%96%B0%E6%A3%80%E6%B5%8B
同时官方也提供了相应的api来解决这个问题
vm.$set(vm.items, indexOfItem, newValue)