路由懒加载

路由懒加载：const 组件名=() => import('组件路径');
路由传参：

 注意：，当使用路由参数时，例如从 /find/hello导航到 /find/word，原来的组件实例会被复用。因为两个路由都渲染同个组件，不会触发生命周期钩子，需要通过watch来监听路由参数的变化

例如“

    export default {
        name:'find',
        .....
        watch:{
            '$route'(to,from) {
                console.log(to.params);
            }
        },

组件中的slot，通过slot可以让组件复用性更强

编程式导航：即动态创建的路由

添加路由：this.$router.push()  ，会向 history 添加新记录
前进和后退：this.$router.go(步骤)
替换：this.$router.replace()  ，它不会向 history 添加新记录



编程式导航如何传参：
    // 命名的路由
      
    router.push({ name: 'user', params: { userId: 123 }})

          其中：name为路由表router.js每项路由的名子

      例如：
         {
            name:'login',
            path:'/login',
            component:login
          },
    
    // 带查询参数，变成 /register?plan=private
    router.push({ path: 'register', query: { plan: 'private' }}) 

svg: svg矢量图，放大不失真，可以通过css,js操纵
应用领域：动画，icon等

svg使用：

第一步：http://www.iconfont.cn/ 官网，搜索需要的icon并添加到购物车
第二步：找开购物车，点击“下载代码”并解压，找到demo_symbol.html文件
第三步:打开demo_symbol.html文件，找开chrome开发者工具 ->elements
第四步：找到并右击svg标签->eidt as html，全选并复制
第五步：找开vue脚本架中的index.html，并将刚才复制的svg代码粘贴进云
第六步：将svg嵌入到对应的图标位置,格式：
     <svg class="icon" aria-hidden="true">
          <use :xlink:href="svg的id名`"></use>
      </svg>