什么是 <router-view :key="$route.fullPath"> ？

Question

我对 Vue.js 完全陌生，我想我对路由器如何处理以下内容有所了解：

<router-link to="/">

但我并不真正理解以下行的作用：

<router-view :key="$route.fullPath"></router-view>

我相信 router-view 本身可以确保显示内容，但关键部分是什么意思？

Answer 1

见Special Attributes - key

它还可以用于强制替换元素/组件，而不是重复使用它。当您想要：

• 正确触发组件的生命周期挂钩
• 触发转换

$route.fullPath 定义为

完整解析的 URL，包括查询和哈希。

如果您将key 绑定到$route.fullPath，则每次发生导航事件时，它总是“强制替换” <router-view> 元素/组件。

如上所述，这很可能是为了触发过渡/动画。