vuejs中，import进来的为子组件，router-view引入进来的和当前（layout）组件是什么关系呢？

Question

项目中所遇到问题，为了描述各组件之间的关系，画图如下：

红色框为 layout（包含一个<router-view />标签）页，黑色框为当前红色框引用的子组件，问题如下：

1. 最外层的红色框和import进来的top-bar-component组件是父子管子，那么和 router-view 引进来的里面的红框是什么关系？

Answer 1

Answer 2

很显然的也是父子关系啊

Answer 3

非要有说个关系的话，那应该是算子路由了

Answer 4

router-view是当前layout的子组件，router-view引入的是router-view的子组件，那layout和router-view的子组件就是爷爷和孙子的关系，不过这不重要了不是父子关系就都是非父子组件

Answer 5

打开你的Vue-Devtools，什么关系在组件树里都有。