首先先进入阿里巴巴矢量图标库进行一顿骚操作（骚操作太简单了，傻瓜式操作）
主要是记录一下在导入到项目的过程
这里要注意的是我导入的是Unicode字体图标
1.引用线上的图标库
注意：在本地调试的时候（就是当你的浏览器网址是file协议开头的时候），
url(//)里双斜杠之前记得加上https:，像这样url(https://at.alicdn.com...)，
不然会用file协议访问链接就找不到。
<style>
@font-face {
font-family: 'iconfont'; /* project id 939168 */
src: url('https://at.alicdn.com/t/font_939168_ft3krx2fz8.eot');
src: url('https://at.alicdn.com/t/font_939168_ft3krx2fz8.eot?#iefix') format('embedded-opentype'),
url('https://at.alicdn.com/t/font_939168_ft3krx2fz8.woff') format('woff'),
url('https://at.alicdn.com/t/font_939168_ft3krx2fz8.ttf') format('truetype'),
url('https://at.alicdn.com/t/font_939168_ft3krx2fz8.svg#iconfont') format('svg');
}
.iconfont{
font-family:"iconfont" !important;
font-size:40px;
font-style:normal;
color: brown;
-webkit-font-smoothing: antialiased;
-webkit-text-stroke-width: 0.2px;
-moz-osx-font-smoothing: grayscale;
}
</style>
<body>
<i class="iconfont"></i>
</body>2.下载下来了在本地进行引用。
导入相应的文件夹，一定保证src能访问得到就行了（很重要，不然就没效果了）
<style>
@font-face {
font-family: Iconfont;
src: url('iconfont.ttf'),
url('iconfont.svg'),
url('iconfont.woff'),
url('iconfont.eot');
}
.iconfont{
font-family:"iconfont" !important;
font-size:40px;
font-style:normal;
color: brown;
-webkit-font-smoothing: antialiased;
-webkit-text-stroke-width: 0.2px;
-moz-osx-font-smoothing: grayscale;
}
</style>
<body>
<i class="iconfont"></i>
</body>3.第三种最简单啦 使用Font css最简单的
下载下来后，在阿里妈妈里面赋值下面的代码，如果加了图标，就去重新复制
然后在项目里面 index.html里面引入就好了
<!--字体图标样式-->
<link rel="stylesheet" href="//at.alicdn.com/t/font_939168_lejovfgepqq.css">然后在main.js里面进行引入css文件，注意路径问题
//引入字体图标
import './common/fonts/iconfont.css'最后在相应的位置使用就好啦
<i class="iconfont icon-guanli1"></i>关于子路由：
1.在router.js里面我们可以这样进行书写 子路由
{
path: '/card',
name: 'card',
component: Card,
children: [{
path: '/card/sendCard', //根据id变量来进行传值 可以切换不同的页面
component: SendCard
},{
path: '/card/batchSendCard',
component: BatchSendCard
},{
path: '/card/browseCard',
component: BrowseCard
},{
path: '/card/operationCard',
component: OperationCard
},{
path: '/card/fingerPrint',
component: FingerPrint
},{
path: '/card/faceAdd',
component: FaceAdd
}]
},2.然后在对应的router里面 router-link to=“/card/faceAdd”
3.然后在对应的父组件里面 <router-view></router-view>
关于高亮问题应该注意点的点：
这个要注意的是，注意在里面的router-link 里面还要继续在包裹一个div,结构如下：
<router-link to="/card/browseCard" tag="div" class="cardleft-l">
<div class="cardleft-content">卡浏览</div>
</router-link>然后在css样式里面自行定义就好了，就有效果了
.router-link-active .cardleft-content{
background-color: #0966fe;
color: #fff;
}