前情提纲

良久没有写Vue了，略有陌生，这个东西照样得多用。
下昼看到一个需求，挑选相册图片作为轮播图显现。接口返回相册列表，用户选一下再扔回去。
直到我看到e.target.className我就晓得这个事变不简朴。。

Vue是数据驱动

数据驱动这个是我以为和jQuery不一样的处所。
jQuery是点一下，加个class,移个class。
Vue是点一下，数据纪录，然后自动关照视图。
一个是把选中状况保存在了DOM，一个是把选中状况保存在了js数据模型里。
所以在看到了运用Vue然后猎取DOM改class的行动，我实时阻止了他。话说你都本身搞了，要Vue干吗。。。

数据驱动和之前的头脑 在一起会怎样？

数据驱动是一个数据到视图的历程，假如你只改视图不改数据。那末他在其他的处所革新了数据，就有能够致使视图不同步。比方写的时刻写了，那末读的时刻读出来的有能够不一样，为何会如许？由于有两个处所能够改呀，Vue把DOM删了，新衬着的没有你写的状况，读的时刻读个鬼。想一想，这一个试试看的东西，能好使吗？

Vue怎样完成这个结果

说了那末多空话，先上地点吧，传送门-我写的DEMO
下面简朴说说三种写法的思绪

1. 选中的id做成一个数组，多保护一个行列。:class="{selected: ~checkSelect(item.id)}"衬着的时刻去推断数组内里有谁人id没有。
2. 选中的id做成一个对象，多保护一个对象。:class="{selected: selectList[item.id]}"和前一个比拟对象的话，id作为key查找起来方便了许多。这里要注意的是.$set，划重点要考的。
3. 直接改原对象，多加一个参数。这个不怎样引荐。

在我写完代码，写文章的时刻，需求就变了。难熬痛苦。。。。去改代码。。。。
在我写完代码，写文章的时刻，需求就变了。难熬痛苦。。。。去改代码。。。。
在我写完代码，写文章的时刻，需求就变了。难熬痛苦。。。。去改代码。。。。