this.$router.resolve和push的区别

this.$router.resolve和this.$router.push是Vue Router中用于导航的两个方法，它们的区别在于：

1. 参数类型：this.$router.resolve只支持query参数，而this.$router.push可以同时支持query参数和params参数。

2. 导航方式：this.$router.resolve只是返回目标路由的信息，不会进行页面跳转，而this.$router.push会进行页面跳转。

3. 地址栏显示：使用this.$router.push进行路由跳转时，参数会显示在地址栏中；而使用this.$router.resolve进行路由跳转时，参数不会显示在地址栏中，可以通过结合localStorage或第三方插件来保存参数。

相关问题

this.$router的resolve函数使用params传参

你可以使用以下代码来使用 `this.$router` 的 `resolve` 函数传递参数：

// 假设你要跳转到名为 'user' 的路由，并且需要传递一个名为 'id' 的参数
const routeParams = { id: 123 }

// 使用 resolve 函数生成目标路由的完整路径
const fullPath = this.$router.resolve({
  name: 'user',
  params: routeParams
}).href

// 通过 $router.push 方法跳转到生成的路径
this.$router.push(fullPath)

在上面的示例中，我们使用 `resolve` 函数从路由名称和参数生成目标路由的完整路径，然后通过 `$router.push` 方法跳转到该路径。这样就可以实现使用 `params` 传递参数了。

Vue中使用this.$router.resolve打开新页面之后导航栏不见了 是为什么

使用`this.$router.resolve`打开新页面时，可能会出现导航栏不见的情况，这是因为`this.$router.resolve`是在当前页面打开一个新的路由，不会重新加载整个页面，所以导航栏不会重新渲染。

如果你需要在新页面中显示导航栏，可以考虑以下两种解决方法：

1. 在新页面中手动引入导航栏组件：你可以在新页面中手动引入导航栏组件，并在新页面的模板中使用该组件。这样就可以在新页面中显示导航栏了。

2. 使用`.push`方法打开新页面：相比于`this.$router.resolve`方法，使用`.push`方法打开新页面可以重新加载整个页面，包括导航栏。你可以使用以下代码来打开新页面：

   this.$router.push({ path: '/new-page' });

这样就可以在新页面中显示导航栏了。