Vue-router实现客户端路由

最新推荐文章于 2023-09-21 11:24:20 发布

weixin_33827731

最新推荐文章于 2023-09-21 11:24:20 发布

阅读量399

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://blog.51cto.com/12268222/2392739

本文详细介绍如何在Vue项目中创建并配置vue-router，包括项目创建、安装依赖、引入和使用vue-router，以及设置路由的基本用法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1 创建一个项目

vue create test-vue

2 安装vue-router

npm install vue-router --save

3 引入vue-router

[main.js]
import VueRouter from 'vue-router'
Vue.use(VueRouter)

4 基本用法

[router.js]
import {routes} from './router' =>(export const routes=[
    {path:'/',components:{
            default:PageHome,
            'test1':PageHome,
        }
    },
    {path:'/About',component:PageAbout},
])

[main.js]
const router=new VueRouter({
  routes,
  mode:'history'
})
new Vue({
  render: h => h(App),
  router,
}).$mount('#app')

5 边写边记。。。

转载于:https://blog.51cto.com/12268222/2392739