vue 路由跳转

// Vue 路由跳转示例代码

// 1. 使用 this.$router.push 方法进行路由跳转
this.$router.push('/home'); // 跳转到 /home 路由

// 2. 使用命名路由进行跳转
this.$router.push({ name: 'user', params: { userId: 123 }}); // 跳转到名为 'user' 的路由，并传递参数

// 3. 使用 query 参数进行跳转
this.$router.push({ path: 'register', query: { plan: 'private' }}); // 跳转到 /register?plan=private

// 4. 编程式导航，返回上一页
this.$router.go(-1); // 返回上一页

// 5. 替换当前路由，不添加新记录到历史栈
this.$router.replace('/login'); // 替换当前路由为 /login

// 6. 在模板中使用 <router-link> 标签进行路由跳转
<router-link to="/about">关于</router-link> <!-- 点击后会跳转到 /about -->

解释说明：

• this.$router.push()：用于导航到不同的 URL。可以传递字符串路径或对象（包含路径、名称和参数等）。
• this.$router.go(n)：在浏览器历史记录中前进或后退指定的步数。
• this.$router.replace()：类似于 push，但它不会向历史记录添加新记录，而是替换当前记录。
• <router-link>：在模板中使用，提供声明式的导航链接。

如果需要更多详细信息，请查阅 Vue Router 官方文档。