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>

猜你喜欢

转载自www.cnblogs.com/ralapgao/p/9883169.html