vue2路由中router-view不顯示的原因及踩坑記錄
vue2路由router-view不顯示
由于平常都是復制粘貼,對于變量的命名并沒有太大的規(guī)范,在加上看官方文檔并沒與什么說明變量名必須為routes,所以出現(xiàn)了這個原因,不多說上代碼
在代碼中const聲明的變量名必須為routes,千萬不能寫成別的,筆者就寫了一手routers,導致router-view標簽不渲染,結果浪費了一個小時排查錯誤。
import Vue from 'vue' import VueRouter from 'vue-router' import Home from '@/views/home' Vue.use(VueRouter) const routes = [ { path: '/', name: 'Home', component: Home, redirect: '/index', children: [ { path: 'index', name: 'index', component: () => import('@/views/index.vue') } ] } ] const router = new VueRouter({ routes }) export default router
vue vue-router的神坑
router-view不顯示
必須是routes 且是個對象
以上為個人經(jīng)驗,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關文章
Vue實現(xiàn)讓頁面加載時請求后臺接口數(shù)據(jù)
這篇文章主要介紹了Vue實現(xiàn)讓頁面加載時請求后臺接口數(shù)據(jù)2022-08-08詳解Vue3?父組件調用子組件方法($refs?在setup()、<script?setup>?中使用)
這篇文章主要介紹了Vue3?父組件調用子組件方法($refs?在setup()、<script?setup>?中使用),在 vue2 中 ref 被用來獲取對應的子元素,然后調用子元素內部的方法,本文通過實例代碼給大家介紹的非常詳細,需要的朋友可以參考下2022-08-08淺析vue cli3 封裝Svgicon組件正確姿勢(推薦)
這篇文章主要介紹了vue cli3 封裝Svgicon組件正確姿勢,本文通過實例代碼給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下2020-04-04在vue中實現(xiàn)表單驗證碼與滑動驗證功能的代碼詳解
在Web應用程序中,表單驗證碼和滑動驗證是常見的安全機制,用于防止惡意攻擊和機器人攻擊,本文將介紹如何使用Vue和vue-verify-code庫來實現(xiàn)表單驗證碼和滑動驗證功能,需要的朋友可以參考下2023-06-06報錯[vuex] unknown action type: userLogin問
這篇文章主要介紹了報錯[vuex] unknown action type: userLogin問題及解決方案,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2023-06-06