vue3 路由的使用

在Vue3中，创建路由的方式与Vue2.x有一些不同。首先，Vue3中有两种路由模式可供选择：哈希模式（createWebHashHistory）和历史模式（createWebHistory），分别对应Vue2.x中的hash和history模式。你可以使用createRouter函数来创建路由实例。以下是一个示例代码：

import { createRouter, createWebHistory } from 'vue-router';

const router = createRouter({
  history: createWebHistory(),
  routes: \[
    // 定义你的路由配置
  \]
});

export default router;

在Vue3中，你可以使用useRoute钩子来获取当前路由的信息。在setup函数中，你可以通过导入useRoute并调用它来获取route对象，其中包含了当前路由的参数、路径等信息。以下是一个示例代码：

import { useRoute } from 'vue-router';

export default {
  setup() {
    const route = useRoute();

    // 在这里可以使用route对象来获取路由的值
    console.log(route.params);

    return {
      route
    };
  }
};

总结起来，Vue3中的路由使用方式与Vue2.x有一些差异，需要注意使用createRouter函数创建路由实例，并使用useRoute钩子来获取当前路由的信息。
#### 引用[.reference_title]
- *1* [Vue3 中路由的使用](https://blog.csdn.net/Ljwen_/article/details/125258368)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^koosearch_v1,239^v3^insert_chatgpt"}} ] [.reference_item]
- *2* *3* [vue3最全路由使用教程](https://blog.csdn.net/begefefsef/article/details/123304297)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^koosearch_v1,239^v3^insert_chatgpt"}} ] [.reference_item]
[ .reference_list ]