Vue 3（Nuxt/SSR场景）中v-html水合后未即时同步更新的问题求助

我在Vue 3的Nuxt SSR项目里遇到了一个奇怪的水合行为，想请教各位大佬怎么解决。我的组件里有个响应式变量，初始化的时候用了时间戳，结果出现了这样的问题：

客户端首次渲染时，常规的双大括号插值{{ processedHtml }}能正确更新成客户端的时间，但v-html里的内容却一直停留在服务端渲染的值上。只有等后续发生响应式变化（比如我写的那个2000ms后的setTimeout触发），两者才会同步。

具体的表现可以分成三个阶段：

• 服务端渲染阶段：两个地方都显示服务端时间（比如12:00:00）
• 客户端水合阶段：{{ processedHtml }}更新成客户端时间（12:00:01），但v-html里的内容依然停留在12:00:00
• 2000ms后：两个地方都更新成新的时间戳，终于同步了

下面是我写的最小复现组件：

<template>
  {{ processedHtml }}
  <div v-html="processedHtml" class="prose max-w-none prose-a:text-blue-600 hover:prose-a:underline"></div>
</template>

<script setup lang="ts">
import { computed, ref } from 'vue';

const props = defineProps<{
  node: any;
}>();


const nowDate = ref<string>(Date.now().toString());

setTimeout(() => {
  nowDate.value = Date.now().toString();
}, 2000);

const processedHtml = computed(() => {
  return `<p>${nowDate.value}</p>`;
});
</script>

我猜测可能是Vue的水合算法因为根元素标签匹配，就跳过了v-html的更新，但我搞不懂为什么它和双大括号插值的行为不一样。

想问下各位，怎么才能让v-html在水合完成后立刻和客户端的响应式状态同步呢？

备注：内容来源于stack exchange，提问作者Fijjit