什么是<router-view:key =“ $ route.fullPath”>?

时间:2018-10-17 05:45:20

标签: javascript html vue.js vue-router

我对Vue.js完全陌生,我认为我对路由器如何处理类似的东西有一些了解:

<router-link to="/">

但是我不太了解以下内容:

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

我相信路由器视图本身可以确保显示内容,但是关键部分是什么意思?

1 个答案:

答案 0 :(得分:11)

请参见Special Attributes - key

  

它也可以用于强制替换元素/组件,而不是重新使用它。当您要执行以下操作时会很有用:

     
      
  • 正确触发组件的生命周期挂钩
  •   
  • 触发过渡
  •   

$route.fullPath定义为

  

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

如果您将key绑定到$route.fullPath,则每次发生导航事件时,它将始终“强制替换”

如上所述,这很可能是为了触发过渡/动画而完成的。