vue小技巧

1. v-for中的key
   为每个节点添加唯一标识，提高虚拟DOM的更新效率

2. soped的实现原理
   通过PostCSS转译实现

   <style scoped>
   .example {
    color: red;
   }
   </style>
   

   转译后

   <style>
   .example[data-v-5558831a] {
    color: red;
   }
   </style>
   

   PostCSS给一个组件中的所有dom添加了一个独一无二的动态属性，然后，给CSS选择器添加一个对应的属性选择器来选择该组件中dom，这种做法使得样式只作用于含有该属性的dom——组件内部dom。

   但是在引用了第三方插件,需要在组件中局部修改第三方组件的样式，而又不想去除scoped属性造成组件之间的样式污染。此时只能通过特殊的方式，穿透scoped

   <style scoped>
    外层 >>> 第三方组件 {
     样式
    }
   </style>
   

   另外

   可以通过在外层dom上添加唯一的class来区分不同组件。这种方法既实现了类似于scoped的效果，又方便修改各种第三方组件的样式