vue頁面不能根據(jù)路徑進行跳轉(zhuǎn)的解決方法
源碼
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)建了很多個頁面,并且在路由文件補充頁面的跳轉(zhuǎn)路徑。但在瀏覽器的地址欄輸入不用鏈接,卻不能訪問相應(yīng)的頁面。
原因
vue沒有渲染頁面
解決
在app.vue補充
<template> <div id="app"> <!--補充的內(nèi)容--> <router-view/> <!--補充結(jié)束--> </div> </template> <script> export default { name: 'app', } </script> <style> </style>
到此這篇關(guān)于vue頁面不能根據(jù)路徑進行跳轉(zhuǎn)的解決方法的文章就介紹到這了,更多相關(guān)vue 路徑跳轉(zhuǎn)內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
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)路由跳轉(zhuǎn)
這篇文章主要給大家介紹了關(guān)于vue3+element?plus中利用el-menu如何實現(xiàn)路由跳轉(zhuǎn)的相關(guān)資料,在Vue?Router中我們可以使用el-menu組件來實現(xiàn)菜單導(dǎo)航,通過點擊菜單項來跳轉(zhuǎn)到不同的路由頁面,需要的朋友可以參考下2023-12-12