Vue学习---路由（二）

Vue路由的基本使用

需要注意版本问题，非常重要

版本一：借鉴该博客     Vue 路由的基本使用 - 知乎

借鉴上面作者我出现了问题：

问题一：export 'default' (imported as 'Vue') was not found in 'vue'

解决：

关于运行vue项目时，警告提示"export ‘default’ (imported as ‘Vue’) was not found in ‘vue’

问题二：export 'default' (imported as 'VueRouter') was not found in 'vue-router'

代码如下，书写的代码不一样

在你想要建立vue项目的文件夹中输入cmd,输入命令：vue init webpack router_demo

进入到项目中：cd router_demo

前端路由：Hash地址 与组件之间的对应地址

VueRouter 的基本使用：

① 安装 vue-router 包

② 创建路由模块

③ 导入并挂载路由模块

④ 声明路由链接和占位符

1、安装 vue-router ： npm i vue-router

2、创建路由模块，在 src 源代码目录下，新建 router/index.js 路由模块，并初始化如下的代码：

//1.导入Vue和VueRouter的包
import {createApp} from 'vue'
import VueRouter,{ createRouter, createWebHashHistory } from 'vue-router'
//2.调用Vue.use()函数，把VueRouter安装为Vue的插件
createApp.use(VueRouter)
//3.创建路由的实例对象
const router = createR