摘要：
最近编写的项目有许多下拉菜单，每个菜单都有两种对应的类型。现在，产品需要在跳转到不同类型时重新渲染数据。我尝试了几种方法。我用手表听路线判断，但发现输入的值不会被替换。所以我想用钥匙。如果不使用密钥，Vue将使用最小化动态元素的算法，并尽可能修复/重用相同类型的元素。使用key，它将根据key的变化重新排列元素的顺序，并删除不存在key的元素。
最近写的这个项目，有很多下拉菜单，每个菜单会有相应的两种类型。现在产品的需求是，跳转到不同的类型 需要页面重新渲染数据
那么问题来了。
我试了好几种方法，用watch监听路由去判断，但是发现输在input里面的值是不会被替换掉的
所以想到了用key 去如果不使用key，Vue会使用一种最大限度减少动态元素并且尽可能的尝试修复/再利用相同类型元素的算法。使用key，它会基于key的变化重新排列元素顺序，并且会移除key不存在的元素。
因为工作性质，不能贴代码
所以
<router-view v-if="isRouterActive" :key="key"></router-view>
data(){
return isRouterActive:true,
key:''
}
watch:{
'$route'(to,from){
this.isRouterActive = false;
this.key = Math.random()*1000;
this.$nextTick(()=>(this.isRouterActive = true))
}
}