Hydration Error at use teleport

Environment

• node: LTS
• nuxt: latest

Reproduction

https://codesandbox.io/s/nuxt3-teleport-bug-6b2vr

Describe the bug

Hello 😀

Hydration error occurs when using teleport in nuxt3. I inserted a teleport target in app.vue and it works normally until code movement. However, since hydration mismatch occurs, the function of the code to be teleported cannot operate normally.

Additional context

No response

Logs

[Vue warn]: Hydration children mismatch in <div>: server rendered element contains fewer child nodes than client vdom. 
  at <Example> 
  at <Index onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< 
undefined
> key="/" > 
  at <BaseTransition mode="out-in" appear=false persisted=false  ... > 
  at <Transition name="page" mode="out-in" > 
  at <NuxtLayout key=0 name=undefined > 
  at <RouterView> 
  at <NuxtPage> 
  at <App> 
  at <Root> 

Hydration completed but contains mismatches.

[cdwmhcc]

Has this problem been resolved?

[nixstrom]

I have also created a reproduction repository.

https://github.com/nixstrom/nuxt3-teleport-issue.git

I also created the same scenario in a “vanilla” Vue/Vue-router setup. This was working as expected; the issue only occurs for me when I add Nuxt3 to the mix.