vue3.0使用vue-router和遇到问题

二、vue-router的使用

1、在main.js中配置

// 引入router
import router from './router/index'

createApp(App).use(vant).use(router).mount('#app')
这里需要注意的是：
use(router)要在mount('#app')的前面

2、在router/index.js中配置

// src/router/index.js
import { createRouter, createWebHashHistory } from 'vue-router'
import Home from '../views/login/index.vue'
 
// createRouter 创建路由实例
const router = createRouter({
  history: createWebHashHistory(), // hash模式：createWebHashHistory，history模式：createWebHistory
  routes: [
    {
      path: '/',
      component: Home
    }
  ]
})
 
// 抛出路由实例, 在 main.js 中引用
export default router

注意：这里可能报错

Uncaught TypeError: Cannot use 'in' operator to search for 'path'

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Ibl8Tnqm-1657706081579)(C:\Users\13198\AppData\Roaming\Typora\typora-user-images\1657705858639.png)]

（1）[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-HJV2EUMd-1657706081581)(C:\Users\13198\AppData\Roaming\Typora\typora-user-images\1657705892713.png)]

将createWebHashHistory看作变量，没有带（），就会报错

（2）如果（1）没有问题的话，查看自己的App.vue

是否写成了<router-link></router-link>，如果是替换为 <router-view></router-view>