Vue 强制替换元素/组件

场景：今天在项目中进行组件强制刷新的时候，遇到一个问题，记录下，与大家分享下采坑 填坑记录。

问题：在A（兄弟）组件中通过按钮切换到B（兄弟）组件，然后再次点击进入A组件的左侧菜单（父组件menuParent），重新进入A组件，发现页面显示的是B组件内容，于是想到了父子组件传值，通过v-if来修改AB的切换（页面结构是<A v-if=“true”></A>  <B v-else></B>）,很遗憾，没实现效果。发现官网有一个api key

解决：通过menuParent父组件中给子组件 绑定key值

           关键代码如下：

           1、 <tabs :key='menuKey' ></tabs>,

           2、menuKey在data中 初始化 menuKey：1，

           3、在点击左侧菜单进入A组件的方法里面++this.menuKey

官网key api地址https://cn.vuejs.org/v2/api/#key