快捷導(dǎo)航

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

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

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

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

隨著項目越來越大，把所有route寫在一個文件里就顯得雜亂。

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

#多個組件路由
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)算符
 ]
})

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

您可能感興趣的文章:

相關(guān)文章

vue+Vue Router多級側(cè)導(dǎo)航切換路由(頁面)的實現(xiàn)代碼
這篇文章主要介紹了vue+Vue Router多級側(cè)導(dǎo)航切換路由(頁面)的實現(xiàn)代碼，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2018-12-12
Vue3+Ant?design?實現(xiàn)Select下拉框一鍵全選/清空功能
在做后臺管理系統(tǒng)項目的時候,產(chǎn)品增加了一個在Select選擇器中添加一鍵全選和清空的功能,他又不讓在外部增加按鈕,其實如果說在外部增加按鈕實現(xiàn)全選或者清空的話,功能比較簡單的,下面給大家分享Vue3+Ant?design?實現(xiàn)Select下拉框一鍵全選/清空功能,需要的朋友可以參考下
2024-05-05
vue中created、watch和computed的執(zhí)行順序詳解
由于vue的雙向數(shù)據(jù)綁定,自動更新數(shù)據(jù)的機(jī)制,在數(shù)據(jù)變化后,對此數(shù)據(jù)依賴?的所有數(shù)據(jù),watch事件都會被更新、觸發(fā),下面這篇文章主要給大家介紹了關(guān)于vue中created、watch和computed的執(zhí)行順序,需要的朋友可以參考下
2022-11-11
Vue實現(xiàn)一個動態(tài)添加行的表格步驟詳解
在Vue組件中定義表格的數(shù)據(jù)模型,通常使用一個數(shù)組來存儲表格的數(shù)據(jù),每一行數(shù)據(jù)可以是一個對象,對象的屬性對應(yīng)表格的列,這篇文章主要介紹了Vue實現(xiàn)一個動態(tài)添加行的表格步驟詳解,需要的朋友可以參考下
2024-05-05
Element el-table的formatter和scope?template不能同時存在問題解決辦法
本文主要介紹了ElementUI?el-table?的?formatter?和?scope?template?不能同時存在問題解決辦法，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2022-08-08
前端vue3樹形組件使用代碼示例
最近在開發(fā)時遇到一個問題,是在輸入框里面放一個樹形組件,這篇文章主要給大家介紹了關(guān)于前端vue3樹形組件使用的相關(guān)資料,文中通過代碼介紹的非常詳細(xì),需要的朋友可以參考下
2024-07-07
淺談vue中g(shù)et請求解決傳輸數(shù)據(jù)是數(shù)組格式的問題
這篇文章主要介紹了淺談vue中g(shù)et請求解決傳輸數(shù)據(jù)是數(shù)組格式的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
2020-08-08
Vue手機(jī)號正則匹配姓名加密展示功能的實現(xiàn)
這篇文章主要介紹了Vue手機(jī)號正則匹配，姓名加密展示,本文通過實例代碼給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下
2022-08-08
VUE使用canvas實現(xiàn)簽名組件
這篇文章主要為大家詳細(xì)介紹了VUE使用canvas實現(xiàn)簽名組件，兼容PC移動端，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2022-07-07
vue router下的html5 history在iis服務(wù)器上的設(shè)置方法
這篇文章主要介紹了vue router下的html5 history在iis服務(wù)器上的設(shè)置方法，需要的朋友參考下吧
2017-10-10