vue组件更新问题

我们有时迫不得已需要强制更新组件，解决一些难以处理的问题。主要方法就是使用v-if或者更新组件的key值，实际开发中，大家还是仁者见仁，结合实际情况，尽量避免使用把

方法一：

<template>
    <div>
        <header>
            <span @click="update">更新组件内数据</span>
        </header>
        <ControlTable :key='time'></ControlTable>
    </div>
</template>
<script setup>
import ControlTable from './ControlTable.vue';
 const time = ref(new Date().getTime());

const update = () => {
    time.value = new Date().getTime();
};
</script>

方法二：

<template>
    <div>
        <header>
            <span @click="update">组件重新渲染</span>
        </header>
        <ControlTable v-if="show"></ControlTable>
    </div>
</template>
<script setup>
import ControlTable from './ControlTable.vue';

const show = ref(true);

const update = () => {
    show.value = false;
    setTimeout(() => {
        show.value = true;
    }, 0);
};
</script>