快捷導(dǎo)航

Vue-router 類似Vuex實(shí)現(xiàn)組件化開發(fā)的示例

更新時(shí)間：2017年09月15日 10:10:38 作者：東京的雨不會(huì)淋濕首爾

本篇文章主要介紹了Vue-router 類似Vuex實(shí)現(xiàn)組件化開發(fā)的示例，具有一定的參考價(jià)值，有興趣的可以了解一下

本文介紹了Vue-router 類似Vuex實(shí)現(xiàn)組件化開發(fā)的示例，分享給大家，具體如下：

隨著項(xiàng)目越來越大，把所有route寫在一個(gè)文件里就顯得雜亂。

#單個(gè)組件路由
import a from '../components/a'
export default {
 path: '/a',
 name: 'a',
 component: a
}
import arouter from 'xxx'
export default new Router({
 routes: [
   arouter
 ]
})

#多個(gè)組件路由
import a from '../components/a'
import b from '../components/b'
export default [{
 path: '/a',
 name: 'a',
 component: a
}, {
 path: '/b',
 name: 'b',
 component: b
}]
#arouter.js
export default new Router({
 routes: [
  ...arouter//擴(kuò)展運(yùn)算符
 ]
})

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

vue對(duì)el-autocomplete二次封裝增加下拉分頁(yè)
項(xiàng)目中的聯(lián)想輸入框現(xiàn)在都是采用的el-autocomplete實(shí)現(xiàn)的，但是數(shù)據(jù)增多就會(huì)需要做分頁(yè)處理，本文主要介紹了vue對(duì)el-autocomplete二次封裝增加下拉分頁(yè)，感興趣的可以了解一下
2022-03-03
vue-cli3 配置開發(fā)與測(cè)試環(huán)境詳解
這篇文章主要介紹了vue-cli3 配置開發(fā)與測(cè)試環(huán)境詳解，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2019-05-05
vue3?封裝自定義組件v-model的示例
這篇文章主要介紹了vue3?封裝自定義組件v-model及自定義組件使用v-model，本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下
2022-07-07
基于vue-cli搭建多模塊且各模塊獨(dú)立打包的項(xiàng)目
這篇文章主要介紹了基于vue-cli搭建多模塊且各模塊獨(dú)立打包的項(xiàng)目,本文給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值，需要的朋友可以參考下
2019-06-06
vue返回上一頁(yè)面時(shí)回到原先滾動(dòng)的位置的方法
這篇文章主要介紹了vue返回上一頁(yè)面時(shí)回到原先滾動(dòng)的位置的方法，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2018-12-12
el-select 下拉框全選、多選的幾種方式組件示例詳解
這篇文章主要介紹了el-select 下拉框全選、多選的幾種方式組件示例詳解,本文通過示例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友參考下吧
2023-12-12
Vue的指令中實(shí)現(xiàn)傳遞更多參數(shù)
這篇文章主要介紹了Vue的指令中實(shí)現(xiàn)傳遞更多參數(shù)，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2022-05-05
在vant中使用時(shí)間選擇器和popup彈出層的操作
這篇文章主要介紹了在vant中使用時(shí)間選擇器和popup彈出層的操作，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧
2020-11-11
Vuex(多組件數(shù)據(jù)共享的Vue插件)搭建與使用
Vuex是實(shí)現(xiàn)組件全局狀態(tài)(數(shù)據(jù))管理的一種機(jī)制,可以方便的實(shí)現(xiàn)組件之間數(shù)據(jù)的共享,數(shù)據(jù)緩存等等,下面這篇文章主要給大家介紹了關(guān)于Vuex(多組件數(shù)據(jù)共享的Vue插件)搭建與使用的相關(guān)資料,需要的朋友可以參考下
2022-10-10
如何使用 Vuex的入門教程
在vue中當(dāng)我們管理數(shù)據(jù)的時(shí)候比較亂，我們要用到下面的這個(gè)庫(kù)，本文主要介紹了如何使用 Vuex的入門教程，具有一定的參考價(jià)值，感興趣的可以了解一下
2022-02-02