dom不刷新 vue 加数据后_踩坑vue v-for操作DOM后不更新

踩坑vue v-for操作DOM后不更新

前言

最近在看vue的风格指南时，发现了一个以前在学习，甚至开发时忽略的问题。

现象

看到上面的一段话，想到自己在刚开发的时候遇到过类似的问题。就是在强行修改DOM后(比如改变class)；将v-for 模板数组中，改变的这条删除掉，发现，该class还在。延伸到的场景就是先选择一个或者多个列表，改变了样式(表明该列表被选中)，再删除选中的类别。此时发现该样式还在。描述的不是很清楚，直接上图。

此时选中了第一条和第二条，点删除后如下图:

这时就会发现，为啥标记的颜色会还在，而且出现在了这两条上面。

Title

.click{

background: red;

}

{ {item.name}}

删除

var app = new Vue({

el:"#app",

data:{

list:[

{name:"0",id:"0"},

{name:"1",id:"1"},

{name:"2",id:"2"