3.header组件开发

新建M-Header组件(注意:请在创建组件的时候不要使用H5自带标签如header arctice等,虽然可以正常使用 但是会有警告)


在APP.vue文件中引入并且注册后使用M-Header组件


上面为M-Header页面代码

通过router-link 来达到页面切换 通过.router-link-activce来确定激活页面的那个router-link的样式,通过tag属性来确定这个路由指向标签

注意 style标签上的scoped的意思为:标签里的CSS只在当前页面有效

页面样式:




下节将讲到如何把图标引入项目中,谢谢大家的支持!

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,269评论 19 139
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 174,615评论 25 709
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,865评论 1 92
  • -1- 《浮生六记》一书是清朝文人沈复(沈三白)记叙平生游乐之事的随性散文,全书一共分为六记,但是现在仅存四记:“...
    我是南不二呀阅读 357评论 0 2
  • 拿到这本书的时候,同事不屑地说“这也叫书,广告大集合!”确实,作者在扉页中写明这是一本“因互联网而重生的私人广告笔...
    薛定谔猫猫阅读 2,305评论 0 1