vue-router在不同页面公用相同组件的显示问题

Question

我是初次接触 vue-router ，我想问下，当在APP.vue 布局下：

   <router-link to="/LoginPage"  style="display: block"  class="fontSizelogin"> 登录 </router-link>
<router-view/>
<router-view name="CjBar"></router-view>
<router-view name="ZouMaDeng"></router-view>

当我去到 LoginPage页面的时候， 里面也有 组件 CjBar 和 ZouMaDeng ，如下图：

<template>

<div>
    You login  here！！！
    <router-view  name="ZouMaDeng"></router-view>
    <router-view name="CjBar"></router-view>
</div>

</template>
但是我希望 这两个组件在 B页面的显示效果 和主 入口APP.vue 是 相反的。怎么弄?现在 显示效果是 先出CjBar，然后是 ZouMaDeng ，我希望相反！

Answer 1

<router-view name="ZouMaDeng"></router-view>

<router-view name="CjBar"></router-view>这两个模块,可以单独放在comment.vue中,然后在别的页面应用就只需要编写你定义的组件名,就不会出现你所说的情况了