在Vue js中从一个详细信息页面到主详细信息页面

Question

我想从一个详细信息页面转到另一个详细信息页面。

例如，我当前的页面是http://localhost:8000/#/product/bridal-suit，其中bridal-suit是动态子弹

在此页面中，上面提到的相关产品。当我单击其中一个相关产品时，它应该在更改了数据的情况下打开同一页面，但问题是没有更改，并且仍然相同。

这是相关产品v-bind:to="'/product/'+ product.slug"

的代码

Answer 1

向组件添加:key属性。

例如，如果您的组件看起来像这样：

<ProductItem />

您要更改的是$route.params.slug，然后将slug添加为:key：

<ProductItem :key="$route.params.slug" />

更改slug将强制在您的组件上重新渲染并刷新数据:-)

因此，在您的情况下，我猜测将:key="product.slug"传递给您的组件可以解决此问题。

有关updating components的更多信息。