网站推广外包搜外网

• 背景：组件需要重新加载，即重新走一遍组件的生命周期
• 常见解决方案：
  1. 使用v-if指令：v-if 可以实现 true (加载)和 false (卸载)

async reloadComponent() {this.show= false// 加上 nextTick  this.$nextTick(function() {this.show= true})// 或者这种写法// await this.$nextTick()// this.show = true
},

2. 使用key属性：Vue 的 key 属性可以强制重新渲染组件。当组件的 key 值发生变化时，Vue 会销毁旧的组件实例并创建一个新的。

// 组件绑定key
<ChildComponent :key="componentKey" />
// 更新key
reloadComponent() {this.componentKey += 1; // 修改 key 的值
},