feat(field decorator): add teleport attribute and pass it through inp…

[Im-Victor]

…ut and select components

Checklist

List of tasks you have already done and plan to do.

• Fix linting errors
• Tests have been added / updated (or snapshots)

Change information

Describe your modifications here.

Issues

The issues you want to close, formatted as close #1.

Related Links

Links related to this pr.

[vercel]

Someone is attempting to deploy a commit to the varletjs Team on Vercel.

A member of the Team first needs to authorize it.

[pkg-pr-new]

Open in StackBlitz

@varlet/cli

npm i https://pkg.pr.new/@varlet/cli@1936

@varlet/icons

npm i https://pkg.pr.new/@varlet/icons@1936

@varlet/import-resolver

npm i https://pkg.pr.new/@varlet/import-resolver@1936

@varlet/preset-tailwindcss

npm i https://pkg.pr.new/@varlet/preset-tailwindcss@1936

@varlet/preset-unocss

npm i https://pkg.pr.new/@varlet/preset-unocss@1936

@varlet/shared

npm i https://pkg.pr.new/@varlet/shared@1936

@varlet/touch-emulator

npm i https://pkg.pr.new/@varlet/touch-emulator@1936

@varlet/ui

npm i https://pkg.pr.new/@varlet/ui@1936

@varlet/use

npm i https://pkg.pr.new/@varlet/use@1936

@varlet/vite-plugins

npm i https://pkg.pr.new/@varlet/vite-plugins@1936

commit: 28fc440

[haoziqaq]

Why add this API, and what are its use cases?

[Im-Victor]

Why add this API, and what are its use cases?

In Nuxt SSR mode, form components may encounter hydration issues when using teleport to body.

[Im-Victor]

Why add this API, and what are its use cases?

https://codesandbox.io/p/devbox/hrhxx3

[haoziqaq]

We first tried to solve this issue without adding a new API. Thank you for your feedback.

[haoziqaq]

@Im-Victor You can try to upgrade nuxt version to latest (e.g. 4.2.1), It works very well. However, the hydration error frequently occurs in version 3.x, which we believe is a issue with Nuxt itself.

[Im-Victor]

@Im-Victor You can try to upgrade nuxt version to latest (e.g. 4.2.1), It works very well. However, the hydration error frequently occurs in version 3.x, which we believe is a issue with Nuxt itself.

There is currently no plan to upgrade the nuxt version. For the time being, form classes will be handled with client-only.