Vue.js vue路由器配置哪里出了问题，或者问题出在我的组件中的某个地方？

我有在Home vue组件中输出的用户列表。列表中的每一项都来自vuex，都有自己的详细信息。当我单击此联系人列表中的任何项目时，vue router会将我带到route/contact/该项目id，例如contact/4536475。现在，当我在特定联系人列表项目的页面上刷新浏览器vue应用程序时，换句话说，我再也无法访问该特定项目对象属性。 这是我的路由器的代码

export default new Router({
  routes: [
    {
      path: "/",
      name: "Home",
      component: Home
    },
    {
      path: "/contact/:id",
      name: "ContactDetails",
      props: true,
      component: ContactDetails

我正在将props属性设置为true，以便将其作为参数传递给联系人项目详细信息组件，如下所示：

<router-link
   class="view-more-btn"
   :to="{ name: 'ContactDetails', params: { id: contact.id }}"
>VIEW DETAILS</router-link>

我哪里出错了，为什么我不能刷新我的联系人项目详细信息页面并仍然保留我使用的状态

---

我是vue的新手，所以如果我不理解，请原谅我。当然，欢迎您提供任何帮助，请提前感谢

问题可能是，您正在引用一个命名路由并手动传递参数。这不会改变浏览器地址栏中显示的实际路由，只显示根路径（我想在您的示例中是

/contact/

）。因此，当您刷新传入的参数/道具时，它们就不再存在了

---

您需要做的是使用

或

，但我如何才能访问我需要从存储中获取该项目数据的特定id（在我的情况下，我将其作为路由器参数传递），也就是说，我需要它在我的详细组件中呈现绑定到该id的特定数据。该id将作为属性在您的组件中可用，因为您使用
path:'/contact/:id
和
props:true
配置了路由。然后提供一个展示您的示例的codesandbox或JSFIDLE，否则我们帮不了忙。我在github repo中有这个问题，我不太明白问题是什么，但如果是关于保留信息的，如果你能更好地向我解释的话，还有“保持活力”。
export default {
  props: ["id"],
  computed: {
    contact() {
      return this.$store.getters.getContactDetails(this.id);
    }
  }