vue css样式
* **scoped: **仅影响当前组件下所有DOM节点、子组件根节点;
* 非scoped: 影响整个页面下所有DOM节点;(即会影响页面内其他组件下的DOM节点);
* 组件内隔离方案: style声明为module,且在HTML节点上使用:class="[$style.class1, .., $style.classN]";
* 为避免受父组件样式影响,创建组件叶,应使用空样式div包含有效DOM元素;
1 scoped原理
场景:需要修改当前组件,或子组件根节点的样式,同时不影响页面内其他组件样式