vue2路由加id。id不同刷新页面

对于这个问题，我理解您的意思是：如何在 Vue2 路由中传递参数 id，并且当 id 发生变化时刷新页面。这可以通过以下步骤实现：

1. 在路由配置文件中定义带参数的路由：

{
  path: '/details/:id',
  name: 'Details',
  component: Details
}

2. 在组件中通过 `$route.params.id` 获取传递的参数 id：

export default {
  name: 'Details',
  mounted() {
    const id = this.$route.params.id
    // do something with the id
  }
}

3. 监听 `$route` 对象的变化，当参数 id 发生变化时，使用 `location.reload()` 方法刷新页面：

export default {
  name: 'Details',
  watch: {
    '$route': function(to, from) {
      if (to.params.id !== from.params.id) {
        location.reload()
      }
    }
  }
}

这样就可以实现在 Vue2 路由中传递参数 id，并且当 id 发生变化时刷新页面。

相关问题

Vue2路由:Id.配置的。 I’d切换后为什么页面不刷新

这可能是因为您在路由切换时，只是改变了URL中的id参数，而没有进行页面刷新。Vue2的路由使用了浏览器的History API，它可以在不刷新页面的情况下改变URL，但并不会重新加载页面。

如果您需要在路由切换时重新加载页面，可以考虑在路由组件中使用`beforeRouteUpdate`生命周期钩子，手动触发一次页面刷新。或者，您也可以在路由配置中添加一个`key`属性，当路由切换时，该属性的值会发生变化，从而强制组件重新渲染。例如：

const routes = [
  {
    path: '/user/:id',
    component: User,
    key: route => route.params.id
  }
]

在上面的代码中，通过传入一个函数来动态生成`key`属性的值，该值会随着路由参数的变化而变化。这样，当路由切换时，组件就会重新渲染，页面也会刷新。

vue路由传参刷新页面参数丢失

在 Vue 路由传参时，如果刷新页面参数丢失，有以下几种可能的原因：

1. 参数没有在路由配置中声明

如果你使用的是动态路由参数，例如 `/user/:id`，那么在路由配置中需要声明这个参数，否则在刷新页面时，参数会被视为普通的路径，而不是路由参数。在路由配置中声明这个参数的方式如下：

{
  path: '/user/:id',
  name: 'user',
  component: User,
  props: true // 声明参数为路由参数
}

2. 参数没有使用路由参数传递方式

如果你使用的是 query 参数传递方式，例如 `/user?id=123`，那么在刷新页面时，参数会被视为普通的查询参数，而不是路由参数。在使用路由参数传递方式时，参数会被存储在路由对象的 params 属性中，可以通过 this.$route.params 来获取参数。在模板中可以通过 $route.params.id 来获取参数。

3. 刷新页面时，组件被重新加载

如果刷新页面时，组件被重新加载，那么在组件中的数据会被重置，而且路由参数也会丢失。在这种情况下，可以在组件的 created 钩子中获取路由参数，并初始化组件的数据。例如：

created() {
  this.id = this.$route.params.id
  // 初始化组件数据
}