[Vue]router-view的class是怎么来的?
接触Vue以来,觉得Vue的文档不太友好,知识点太碎片化,可能一个重要的知识点仅仅在文中提一下,但不会出现在索引中。文档读起来也比较晦涩。
有一个router-view
:
<router-view class="content"></router-view>
假设下面的组件会渲染到上面的router-view
中:
<template>
<div class="box">
...
</div>
</template>
最终生成的HTML元素会包含router-view
本身的class
和渲染到它里面的组件根元素的class
:
<div data-v-c1f1971a data-v-7ba5bd90 class="box content">
...
</div>
出现
data-v-c1f1971a
和data-v-7ba5bd90
是因为router-view
所在组件的style
和渲染到它里面的组件的style
都设置了scoped
通过这个例子可以知道,router-view
的class
来自本身的class和渲染到它里面的组件的根元素的class。router-view
所在组件可以设置渲染到它里面的组件的根元素的样式。
这个知识点见过,但是刚才找了半天
Vue
、Vue Router
、Vue-CLI
的文档都没再次发现,真的是可遇而不可求啊。