首先把天猫的导航贴出来,里面包括精选、品牌、会员、购物车、我五个导航及对应的图标。
分析:
1、图标的获取
进入阿里巴巴矢量图标库,网址 http://www.iconfont.cn。
点击官方图标库,选择天猫图标库,选中放入购物车。
点击添加至项目,点击创建新项目按钮,创建tianmao项目,点击确定。
此时会有查看在线链接和下载至本地两种方式,我选择第一种,因为后期如果要添加小图标的话,只需要重新生成在线链接,然后更新link即可
引入图标,使用@H_502_47@区别在第三个class来引入对应图标
此时所需图标处理完毕
2、创建精选、品牌、会员、购物车、我及路由导航组件Home.vue、Brand.vue、Member.vue、Cart.vue、Me.vue、Tabs.vue
使用的样式时less,如果在.vue文件中写样式,style必须写成