最开始使用Vue的时候，是提倡并大量使用的是scoped的。
加上 scoped 属性的style会自动添加一个唯一的属性 。比如data-v-0467f817为组件内 CSS 指定作用域，编译的时候 .errShow会被编译成类似 .errShow[data-v-0467f817]。
这种添加唯一的属性的方法可以满足日常组件局部css作用域的开发需求，但其设计上有一定缺陷，.errShow[data-v-0467f817]并不能保证是唯一的，另外在性能上也不是很好，浏览器搜索.errShow[data-v-0467f817]的速度并不如.errShow，相比于这种方式，CSS modules则做的更彻底，它不是添加属性，而是直接改变类名。
CSS Modules
CSS Modules既不是官方标准，也不是浏览器的特性，而是在构建步骤中对CSS类名选择器限定作用域的一种方式（通过hash实现类似于命名空间的方法）。类名是动态生成的，唯一的，并准确对应到源文件中的各个类的样式。
用法
配置
如果你的项目是用vue-cli搭建的，那么脚手架已经为你配置好了，直接可以使用，如果你是用webpack自己搭建的项目或想要修改默认配置，则进行下面配置。
css-loader关于CSS modules的默认配置如下：
可以使用vue-loader的css Modules选项为css-loader进行自定义的配置
开篇一句话：CSS的伪类，伪元素就当成vue的过滤器使用就好了，我也是想到这个突然就茅塞顿开了。
用法：
:after 选择器表示向选定的元素之后插入内容。
要有content属性
需求举例：div按钮后面有个朝下的ico,点击div后 ico方向朝上
实现办法:
1.可以使用JS实现，div的class名绑定到一个变量上，根据变量的真假值更换class
2.伪类的实现方法
先说思路：
要借助两个class，基础class('base_class')和激活class('rotate').
base_class
相对定位。
base_class:after
放ico朝上的样式，绝对定位。
rotate不要单独加after，不然会取代掉base_class的after,
要两个class都出现才加after
rotate绑定到一个布尔变量上，该变量的真假值由open_select_window更改
html:
