NuxtN
Nuxt6mo ago
13 replies
ISOREX

Extending UInput and UFormField

Hi everyone,

I'm investigating if it's worth switching over to Nuxt UI from Reka UI. There are a few components however where my design doesn't overlap with that of Nuxt UI. One of these cases is the input and form field.

I'm wondering if there is a recommended way of extending these components? For FormField I copied over the source code and started from there (main difference is that the validation errors are shown in a popover and the label and input are inline instead of stacked). For the input I didn't get much further than wrapping Input and adding v-bind="$props".
The reason I have to extend Input is because it needs to inject the blur and focus events.

How would you guys implement this? I have provided my current snippets below.
AC80B66E-0AB3-464E-ABE1-804DB2761C86.png
Was this page helpful?