Question

情境：

我有一个多步形式，如果用户点击下一个按钮，路线中唯一改变的是id，例如表单/step/:id，但每当我的步骤/路由包含与前一个相同的组件时，它只会调用＆＃39;创建的＆＃39;第一个组件的方法，它不会调用下一个组件。

每次更改路线时，有没有办法重新创建/初始化组件？

Answer 1

您可以查看docs

中的“对Params更改做出反应”部分

使用带有params的路由时要注意的一点是，当用户从/ user / foo导航到/ user / bar时，将重用相同的组件实例。由于两个路由都呈现相同的组件，因此这比销毁旧实例然后创建新实例更有效。但是，这也意味着不会调用组件的生命周期钩子。

要对同一组件中的params更改做出反应，您只需观察$ route对象：

  watch: {
    '$route' (to, from) {
      //update the variables with new route params
    }
  },

您还可以查看我的类似答案here。

Answer 2

我还遇到了一个问题。每当我的路径参数更改时，我传递给该组件的道具都不会更新。

在第一次加载时，prop值会更新，但是当我转到下一步/路径时，$route会更新，并且监视中的方法也会被执行，但是支持的值是传递的值与第一步/路径的值相同。然后，当我再次进入下一步/路线时，第三步/路线的分量的值应该是第二步/路线的分量的值。似乎道具的价值落后于实际路线的一步。

以下是我通过道具的方式：

<el-repeater :element.sync="element"></el-repeater>

编辑：但在UI中可以看到的所有数据都已更新且正确，并且这些数据基于已传递的道具。