块虽然方便但是我们需要慎用，因为当我们使用公共组件时会造成很多困难，
增加难度，想知道造成那些难度，需要先从scoped实现原理了解
通过观察DOM结构可以发现：vue通过在DOM结构以及css样式上加上唯一的标记，保证唯一，达到样式私有化，不污染全局的作用，如图，样式属性上也会多一个该字符，以保证唯一
可以看出加上 scoped 后的组件里的标签都会多一个 data-v-469af010 的属性，并且在css样式部分可以看出
由此可知，添加 scoped 属性的组件，为了达到不污染全局，做了如下处理：
其实从原理已经能够了解到慎用原因，这里权当总结
Scope属性定义了行的表头和列的表头：col: 列表头 row: 行表头在第一行的加上值为col的scope属性，声明他们是下面(列)数据单元格的表头。同样的，给每行的开头加上值为row的scope属性声明他们是右边(行)数据单元格的表头。Scope属性还有两个值：colgroup: 定义列组（column group）的表头信息 rowgroup: 定义行组（row group）的表头信息1、将css写成jsp的格式，动态生成css<%@ page contentType="text/csscharset=utf-8" pageEncoding="utf-8" %>
<% // 从数据库或配置文件读取系统管理员设置的系统参数 %>
body { background: <%= bodyBackground %>} /* 应用参数 */
...
2、如要换肤之类，样式修改比较多，应用较多页面的情况，建议将不同样式写入不同的CSS文件，通过jsp/servlet将css的选择参数写入session或application，然后在jsp中判断进行选择
<c:if test='${not empty param.theme}'><c:set var='css' scope='session'>${param.theme}</c:set></c:if>
<link rel="stylesheet" type="text/css" href="<c:url value='/css/${session.css}.css'/>"></link>
