首页 > 其他 > 详细

七、Vue Router 命名视图

时间:2019-12-01 21:34:22      阅读:56      评论:0      收藏:0      [点我收藏+]

命名视图

当一个页面想展示多个视图,而不是嵌套展示时,就需要使用命名视图。在界面中拥有多个单独命名的视图,而不是只有一个单独的出口。如果router-view没有设置名字,则默认的名字为default

<!-- 设置多个视图出口 -->
<router-view></router-view>
<router-view name="leftMenu"></router-view>
<router-view name="rightContent"></router-view>

由于一个视图出口渲染一个对应的组件,因此,对于同一个路由,多个视图就需要多个组件。在路由配置中components组件配置必须带有s

<script>
    const router = new VueRouter({
        routes: [
            path: '/',
            components: {
                'default': Header,
                'leftMenu': Menu,
                'rightContent': Content
            }
        ]
    })
</script>

七、Vue Router 命名视图

原文:https://www.cnblogs.com/yuxi2018/p/11967271.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!