vue 项目初识 路由 router

vue 项目初识 路由 router 并进行初步配置以及简单的组件实现

• 创建好vue项目

  在src目录下找到router目录，内有index.js文件6

• 初步配置router相关配置

import Vue from 'vue'
//配置路由相关信息
import VueRouter from 'vue-router'


//1.通过vue.use(插件)，安装插件
Vue.use(VueRouter)

//2.创建VueRouter对象
const routes = [

]
const router = new VueRouter({
//  配置路由和组件之间的应用关系
  routes
})
//3.将router对象传入到vue实例
export default router

• 使用vue-router步骤

  • 第一步：创建路由组件
    
    在这里插入图片描述
    
    

  • 配置路由映射：组件和路径映射关系

• 使用路由：通过和

• 点击不同组件显示不同组件
  

以上就是初步配置router并运行简单组件