vue常用的指令和动态绑定样式以及选中的状态

一、Vue常用的指令:
1、v-for循环可以循环遍历出数据简单的例子是：

2、v-on动态绑定事件简写是@click=“事件”

3、v-model 双向数据绑定
4、v-if 判断dom元素的显示和隐藏
5、动态绑定样式是用 :style="样式"或者:class=“类名”

6、v-show 也是判断dom元素的显示和隐藏 是 display：none

7、v-text 渲染字符串
8、v-html 渲染html节点及字符串
9、v-bind 绑定属性
Vue单选/多选的效果
1、**includes()**方法判断是否包含某一元素,返回true或false表示是否包含元素，对NaN一样有效
2、**filter()**方法用于把Array的某些元素过滤掉，filter()把传入的函数依次作用于每个元素，然后根据返回值是true还是false决定保留还是丢弃该元素：生成新的数组
单选效果
Dom结构：

JavaScript样式如下：

css样式：

效果：
选中北京时的

多选：
Dom结构:

css样式：

javascript：

效果：