vue页面不能根据路径进行跳转的解决方法
作者：徐子元竟然被占了！！
本文主要介绍了vue页面不能根据路径进行跳转的解决方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
源码
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
问题现象
我们创建了很多个页面，并且在路由文件补充页面的跳转路径。但在浏览器的地址栏输入不用链接，却不能访问相应的页面。
原因
vue没有渲染页面
解决
在app.vue补充
<template>
<div id="app">
<!--补充的内容-->
<router-view/>
<!--补充结束-->
</div>
</template>
<script>
export default {
name: 'app',
}
</script>
<style>
</style>到此这篇关于vue页面不能根据路径进行跳转的解决方法的文章就介绍到这了,更多相关vue 路径跳转内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！