vue3若依框架路由跳转

Vue3 中使用 Nuxt.js（若依）框架进行路由跳转非常直观。首先，你需要安装 Nuxt 的 CLI 并创建一个新的项目。以下是基本步骤：

1. **安装依赖**：

   npm install -g create-nuxt-app
   npx create-nuxt-app your-project-name

2. **进入项目目录**：

   cd your-project-name

3. **配置路由**：
在 `pages` 文件夹下创建路由对应的 Vue 组件，例如：
- `pages/home.vue`
- `pages/about.vue`

4. **在 `nuxt.config.js` 配置文件中设置路由**：

   export default {
     router: {
       mode: 'history', // 使用 history 模式，适用于支持 HTML5 History API 的现代浏览器
       base: '/', // 路由基础路径
       routes: [
         { path: '/', component: '@/pages/Home.vue' },
         { path: '/about', component: '@/pages/About.vue' }
       ]
     }
   }

5. **组件内进行导航**：
在组件内的模板中，你可以通过 `<nuxt-link>` 标签进行路由跳转：

   <template>
     <div>
       <nuxt-link to="/home">Home</nuxt-link>
       <nuxt-link to="/about">About</nuxt-link>
     </div>
   </template>

6. **使用 vuex 或者自定义 guards 进行更复杂的条件跳转管理**，如果需要。

当你运行 `npm run dev` 后，访问 `/` 和 `/about` 就可以看到页面跳转了。