vue路由跳轉(zhuǎn)了但界面不顯示的問題及解決

更新時間：2022年04月28日 09:30:21 作者：Charis-Cai

這篇文章主要介紹了vue路由跳轉(zhuǎn)了但界面不顯示的問題及解決方案，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教

路由跳轉(zhuǎn)了但界面不顯示

沒有在父路由加上router-view，加上下面的代碼即可。

<!-- 路由匹配到的組件將顯示在這里 -->
<router-view></router-view>

路由明明配置好了頁面還是不顯示

在開發(fā)vue項目時，使用vue-router 路由老失效

問題代碼

Vue.use(VueRouter)
var routeslist=[
? {
? ? path:'/',
? ? redirect:'/home'
? }, ? ?//配置路由，這里是個數(shù)組
? { ? ? ? ? ? ? ? ? ? ?//每一個鏈接都是一個對象
? ? path: '/home', ? ? ? ? //鏈接路徑
? ? name: 'home', ? ? //路由名稱，
? ? component: index ? //對應的組件模板
? }
]
const router= new VueRouter({
? ?routeslist
})
new Vue({
? router:router,
? render: h => h(App),
}).$mount('#app')

解決

在使用路由時如何不滿足命名規(guī)范，就必須加上參數(shù)名稱

-注意~ 不只是這里在

new Vue({
router,
render: h => h(App),})

如何VueRouter對象名稱不為router時也需要加上參數(shù)名稱

router:router,

// 指定為routes
const router= new VueRouter({
? ? routes: routeslist
})

以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

詳解在vue中如何使用node.js
這篇文章主要給大家介紹了關(guān)于在vue中如何使用node.js的相關(guān)資料,vue和nodejs經(jīng)常讓新手們感到困惑,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下
2023-07-07
vue 獲取視頻時長的實例代碼
這篇文章主要介紹了vue 獲取視頻時長的實例代碼，代碼簡單易懂，非常不錯，具有一定的參考借鑒價值,需要的朋友可以參考下
2019-08-08
vue中分割線的實現(xiàn)方式
這篇文章主要介紹了vue中分割線的實現(xiàn)方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教
2023-12-12
vue keepAlive緩存清除問題案例詳解
這篇文章主要介紹了vue keepAlive緩存清除問題案例詳解,本篇文章通過簡要的案例,講解了該項技術(shù)的了解與使用,以下就是詳細內(nèi)容,需要的朋友可以參考下
2021-09-09
詳解vue2 $watch要注意的問題
本篇文章主要介紹了詳解vue2 $watch要注意的問題，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2017-09-09
antd的select下拉框因為數(shù)據(jù)量太大造成卡頓的解決方式
這篇文章主要介紹了antd的select下拉框因為數(shù)據(jù)量太大造成卡頓的解決方式，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
2020-10-10
解決vue中無法動態(tài)修改jqgrid組件 url地址的問題
下面小編就為大家分享一篇解決vue中無法動態(tài)修改jqgrid組件 url地址的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
2018-03-03
基于VUE.JS的移動端框架Mint UI的使用
本篇文章主要介紹了基于VUE.JS的移動端框架Mint UI的使用，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2017-10-10
vue+iview分頁組件的封裝
這篇文章主要為大家詳細介紹了vue+iview分頁組件的封裝，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2020-11-11
Vue 動態(tài)路由的實現(xiàn)及 Springsecurity 按鈕級別的權(quán)限控制
這篇文章主要介紹了Vue 動態(tài)路由的實現(xiàn)以及 Springsecurity 按鈕級別的權(quán)限控制的相關(guān)知識，本文通過實例代碼給大家介紹的非常詳細，具有一定的參考借鑒價值,需要的朋友可以參考下
2019-09-09