三:制作页面的标题以及导航部分

1.首先在我们src/components文件夹里面新建一个header文件夹和tab文件夹,这里面分别是放各组的业务组件的

2.写头部的组件,m-header.vue以及tab.vue在编写的地方,有几个注意的地方

(1)header组件

(2)tab组件

这个组件已经完成,然后需要在app.vue这个引入这两个组件,并且运用进去,同样还有几点要注意的时候,这个

(1)对于组件命名的问题(注意组件的命名不能跟标签冲突)

(2)原始的路径是带#,如果不想带这个话,需要在router的index.js里面设置mode:“history”

(3)因为是单页面,所以在设置首页的显示的时候,可以用到这个redirect这个属性,可以首页展示的组件


基本上header.vue以及tab.vue组件就完成了

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

相关阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 176,136评论 25 709
  • 序 今年大前端的概念一而再再而三的被提及,那么大前端时代究竟是什么呢?大前端这个词最早是因为在阿里内部有很多前端开...
    一缕殇流化隐半边冰霜阅读 13,848评论 19 92
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 136,084评论 19 139
  • 在选书的时候面对三毛女士的书我犹豫了很久,最终还是抱着她的一堆书走出了图书馆,心里想着权当是暑假的调味剂吧...
    刘从容_阅读 1,454评论 0 0
  • 现在普遍的观念,是要把自己变成不可或缺的人。雪漠先生在《老子的心事》一书中,提到一个观念,恰恰相反:要把自己变得不...
    石竹阅读 2,750评论 4 3

友情链接更多精彩内容