在vue 中使用v-show 时,组件没有得到重新渲染。以下例子是我v-show 的时候,要默认一个menu高亮,所以对activeIndex重新赋值。 有人会问为什么不用v-if 进到这个页面(这你就别管了)
解决: 使用 this.$forceUpdate() //。配合生命周期函数updated使用
如
html:
<span v-if="refresh">
<el-menu
:default-active="activeIndex"
class="el-menu-demo"
mode="horizontal"
@select="handleSelect"
active-text-color="#409EFF"
>
<menu-tree v-for="item in subMenuData" :key="item[propsId]" :menu="item"></menu-tree>
</el-menu>
</span>
1.在生命周期中
updated(){
this.refresh = true //重新渲染
},
2、在methods中(关键部分):
topTitle(name){
this.$nextTick(()=>{
this.refresh = false
if(name == '项目详情'){
this.activeIndex = '1'
this.$forceUpdate()
}else if(name == '企业详情'){
this.activeIndex = '44'
this.$forceUpdate()
}
})
},