vue强制刷新dom（使用v-if）（添加key）

一、使用v-if

最近在一个项目中遇到一个问题，点击按钮后，只能通过子组件向后端请求数据，但是点击按钮并不能重新加载子组件，因此无法向后端请求数据。

这里我们的子组件为 childComponent，实现刷新的方法如下：

<childComponent v-if="refresh"></childComponent>
<button @click="handleClick"></button>


handleClick() {
    this.refresh = false
    setTimeout(() => {
      this.refresh = true
    }, 0);
}

二、添加key（推荐方法）

为组件添加key，当key变化时dom会被刷新

这里refresh的初始值为false

<childComponent :key="refresh"></childComponent>
<button @click="handleClick"></button>

handleClick() {
    this.refresh = true
}