onPrehydrate
使用 onPrehydrate 在客户端立即运行回调，在 Nuxt 对页面进行水合之前。
此可组合函数在 Nuxt v3.12+ 中可用。
onPrehydrate 是一个可组合函数生命周期钩子，允许您在 Nuxt 对页面进行水合之前立即在客户端运行回调。
这是一个高级实用程序，应谨慎使用。例如，
nuxt-time 和 @nuxtjs/color-mode 操作 DOM 以避免水合不匹配。用法
onPrehydrate 可以直接在 Vue 组件的 setup 函数中调用（例如，在 <script setup> 中），或在插件中调用。它仅在服务器上调用时才有效，并且不会包含在您的客户端构建中。
参数
callback：一个将被字符串化并内联到 HTML 中的函数。它不应该有任何外部依赖项（例如自动导入）或引用回调外部定义的变量。回调将在 Nuxt 运行时初始化之前运行，因此它不应该依赖于 Nuxt 或 Vue 上下文。
示例
app.vue
<script setup lang="ts">
// onPrehydrate is guaranteed to run before Nuxt hydrates
onPrehydrate(() => {
console.log(window)
})
// As long as it only has one root node, you can access the element
onPrehydrate((el) => {
console.log(el.outerHTML)
// <div data-v-inspector="app.vue:15:3" data-prehydrate-id=":b3qlvSiBeH:"> Hi there </div>
})
// For _very_ advanced use cases (such as not having a single root node) you
// can access/set `data-prehydrate-id` yourself
const prehydrateId = onPrehydrate((el) => {})
</script>
<template>
<div>
Hi there
</div>
</template>