52-Vue路由命名视图

和具名插槽使用方法类似.实现一个路由地址显示多个视图(组件),这里实现方法,案例分析

image.png

一.实现方法

  • 添加多个路由出口并设置name属性
  • 给路由配置多个组件


    image.png

    image.png

    image.png
  • 示意:name为left的出口对应组件one
  • name为right的出口对应组件two

二.案例分析

https://m.jd.com/

image.png

  • 首页路由对应多个组件(路由出口)
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • VUE Vue :数据驱动的M V Vm框架 m :model(后台提供数据),v :view(页面),vM(模板...
    wudongyu阅读 10,764评论 0 11
  • 【2019-3-4更新】Vue 2.6+修改了部分语法,对插槽的使用有了较多的更新。在本文中笔者在相应位置给出了更...
    果汁凉茶丶阅读 13,503评论 2 36
  • 什么是组件? 组件 (Component) 是 Vue.js 最强大的功能之一。组件可以扩展 HTML 元素,封装...
    youins阅读 13,176评论 0 13
  • VUE介绍 Vue的特点构建用户界面,只关注View层简单易学,简洁、轻量、快速渐进式框架 框架VS库库,是一封装...
    多多酱_DuoDuo_阅读 7,727评论 1 17
  • 有过几段不尽人意的恋爱,但每次的对象都没有达到自己心目中的标准。 总想着找一个身高180,年龄比我大的人谈恋爱,然...
    陌上花开可缓缓归唉阅读 2,271评论 0 3

友情链接更多精彩内容