vue 路由工程化重构

当项目越来越庞大的时候，路由越来越多，而且遍布的页面也越来越多，

当需要更换地址的时候就无比的繁琐，通过学习了解到可以通过router.js来统一调控

原理： 在路由页面通过name来进行跳转，传入的是{name:'...'}

这样需要修改页面路径的时候只需要在router.js里面修改路径就可以了

 

router/index.js

export default new Router({
  mode: 'history',
  base: _dirname,
  linkActiveClass: "active",
  routes: [
    {
      path: '/',
      name: 'First',
      component: first
    },
    {
      path: '/agedserve',
      name: 'Agedserve',
      component: agedserve
    },
    {
      path: '/carserve',
      name: 'Carserve',
      component: carserve
    },
    {
      path: '/safeguard',
      name: 'Safeguard',
      component: safeguard
    },
    {
      path: '/verbpage',
      name: 'Verbpage',
      component: verbpage
    }
  ]
})

路由页面

<router-link tag="li" :to="{name:'Verbpage', params: {}}">
    <img src="../../static/images/insurance-icon.png" alt="icon">
    <div class="project-child">
       <h3>风险评测</h3>
       <p></p>
    </div>
</router-link>

 

转载于:https://www.cnblogs.com/ralapgao/p/9883169.html