單頁面多路由區域操作

在一個頁面中有兩個及以上的區域，需要通過設置路由的index.js，來操作這些區域的內容

app.vue 中設置：

index.js中設置：

import vue from 'vue'

import router from 'vue-router'

import hello from '@/components/hello'

import first1 from '@/components/first1'

import first2 from '@/components/first2'

vue.use(router)

export default new router ({

routes : [

{

path : '/',

name : 'hello',

components : {

default : hello,

left : first1,

right : first2

}

}

]

})

下面的設置是當url為/#/first 時，交換兩個組件顯示的位置

export default new router ({

routes : [

{

path : '/',

name : 'hello',

components : {

default : hello,

left : first1,

right : first2

}

}, {

path : '/first',

name : 'first',

components : {

default : hello,

left : first2,

right : first1

}

}

]

})

以上就是 vue.js 單頁面多路由區域操作，如有疑問請大家留言，感謝閱讀，希望能幫助到大家，謝謝大家對本站的支持！

希望與廣大網友互動？？

點此進行留言吧！

總結

以上是生活随笔為你收集整理的vue 扫码页面限制区域_Vue.js 单页面多路由区域操作的实例详解的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。