vue設(shè)置默認(rèn)首頁(yè)的操作
更新時(shí)間：2020年08月12日 15:38:50 作者：weixin_43034862
這篇文章主要介紹了vue設(shè)置默認(rèn)首頁(yè)的操作，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
在router.js設(shè)置如下：
index就是默認(rèn)頁(yè)面
const routes = [
// 公司項(xiàng)目
{ path: '/', redirect: '/index' },
{path:'/index',component:index},
{
path:'/example',
component:example,
redirect:'/edetail',
children:[
{path:'/edetail',component:edetail}
]
},
{path:'/login',component:login}
]
不使用在根目錄設(shè)置router的方法，跳轉(zhuǎn)頁(yè)面帶不同的頭部信息時(shí)容易出現(xiàn)問(wèn)題
補(bǔ)充知識(shí)：vue-router默認(rèn)的首頁(yè)渲染設(shè)置
當(dāng)一個(gè)vue項(xiàng)目的頁(yè)面打開(kāi)，總得有一個(gè)默認(rèn)的首頁(yè)組件自動(dòng)出現(xiàn)
不能只是點(diǎn)擊首頁(yè)的跳轉(zhuǎn)才出現(xiàn)
這個(gè)默認(rèn)的打開(kāi)路由配置需要在router.js中的 VueRouter 實(shí)例中，改變r(jià)outes數(shù)組
const router = new VueRouter({
routes:[
{
path:'/',
//redirect 是重新定向
redirect:'/home'
},
{
path:'/home',
component:Home
}
]
})
這樣設(shè)置之后，就將默認(rèn)的路由路徑設(shè)置為/home
以上這篇vue設(shè)置默認(rèn)首頁(yè)的操作就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
Vue Element前端應(yīng)用開(kāi)發(fā)之表格列表展示
在我們一般開(kāi)發(fā)的系統(tǒng)界面里面，列表頁(yè)面是一個(gè)非常重要的綜合展示界面，包括有條件查詢、列表展示和分頁(yè)處理，以及對(duì)每項(xiàng)列表內(nèi)容可能進(jìn)行的轉(zhuǎn)義處理，本篇隨筆介紹基于Vue +Element基礎(chǔ)上實(shí)現(xiàn)表格列表頁(yè)面的查詢，列表展示和字段轉(zhuǎn)義處理。2021-05-05
Vuex是一個(gè)專門為Vue.js應(yīng)用程序開(kāi)發(fā)的狀態(tài)管理庫(kù)。它采用了一個(gè)集中式的架構(gòu)，將應(yīng)用程序的所有組件的狀態(tài)存儲(chǔ)在一個(gè)單獨(dú)的地方。這使得狀態(tài)的管理和維護(hù)變得更加容易2023-03-03
這篇文章主要介紹了vue使用axios上傳文件(FormData)的方法,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04
Vue和React之間如何選擇，這篇文章主要為大家詳細(xì)介紹了Vue和React兩者之間的相同之處，教大家該如何進(jìn)行選擇，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-03-03
Vue3使用Proxy實(shí)現(xiàn)數(shù)據(jù)監(jiān)聽(tīng)的原因分析
在本篇文章里小編給大家整理的是一篇關(guān)于Vue3使用Proxy實(shí)現(xiàn)數(shù)據(jù)監(jiān)聽(tīng)的原因分析內(nèi)容，有需要的朋友們可以跟著學(xué)習(xí)參考下。2021-11-11
下面小編就為大家分享一篇基于Vue渲染與插件的加載順序的問(wèn)題詳解，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-03-03
淺談vuex的基本用法和mapaction傳值問(wèn)題
今天小編就為大家分享一篇淺談vuex的基本用法和mapaction傳值問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-11-11
vue項(xiàng)目在安卓低版本機(jī)顯示空白的原因分析(兩種)
本文給大家?guī)?lái)vue項(xiàng)目在安卓低版本機(jī)顯示空白的原因分析，根據(jù)各自需求給大家?guī)?lái)了兩種原因分析，大家可以參考下2018-09-09
最近在學(xué)習(xí)vue的源碼，總結(jié)了幾種vue中父子組件傳遞數(shù)據(jù)的方法。具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-05-05
vue實(shí)現(xiàn)路由鑒權(quán)和不同用戶登錄
這篇文章主要為大家詳細(xì)介紹了vue中實(shí)現(xiàn)路由鑒權(quán)和不同用戶登錄的相關(guān)知識(shí),文中的示例代碼講解詳細(xì),感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2024-04-04