vue頁面不能根據(jù)路徑進行跳轉的解決方法
更新時間:2023年12月06日 14:31:03 作者:徐子元竟然被占了!!
本文主要介紹了vue頁面不能根據(jù)路徑進行跳轉的解決方法,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧
源碼
app.vue文件
<template> <div id="app"> </div> </template> <script> export default { name: 'app', } </script> <style> </style>
import Vue from 'vue' import VueRouter from 'vue-router' import HomeView from '../views/HomeView.vue' Vue.use(VueRouter) const routes = [ { path: '/homeView', name: 'homeView', component: HomeView }, { path: '/about', name: 'about', // route level code-splitting // this generates a separate chunk (about.[hash].js) for this route // which is lazy-loaded when the route is visited. component: () => import(/* webpackChunkName: "about" */ '../views/AboutView.vue') } ] const router = new VueRouter({ routes }) export default router
問題現(xiàn)象
我們創(chuàng)建了很多個頁面,并且在路由文件補充頁面的跳轉路徑。但在瀏覽器的地址欄輸入不用鏈接,卻不能訪問相應的頁面。
原因
vue沒有渲染頁面
解決
在app.vue補充
<template> <div id="app"> <!--補充的內容--> <router-view/> <!--補充結束--> </div> </template> <script> export default { name: 'app', } </script> <style> </style>
到此這篇關于vue頁面不能根據(jù)路徑進行跳轉的解決方法的文章就介紹到這了,更多相關vue 路徑跳轉內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家!
相關文章
Vue中使用 Echarts5.0 遇到的一些問題(vue-cli 下開發(fā))
這篇文章主要介紹了Vue中使用 Echarts5.0 遇到的一些問題(vue-cli 下開發(fā)),具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-10-10Vue 實現(xiàn)對quill-editor組件中的工具欄添加title
這篇文章主要介紹了Vue 實現(xiàn)對quill-editor組件中的工具欄添加title,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2020-08-08vue3+element?plus中利用el-menu如何實現(xiàn)路由跳轉
這篇文章主要給大家介紹了關于vue3+element?plus中利用el-menu如何實現(xiàn)路由跳轉的相關資料,在Vue?Router中我們可以使用el-menu組件來實現(xiàn)菜單導航,通過點擊菜單項來跳轉到不同的路由頁面,需要的朋友可以參考下2023-12-12