SolidJS•3y ago•

2 replies

Better Way to Write This?

Hey y'all! I have some code that works, but I can't help but feel there must be a better way to write it.

I have this form, and I created a

Field

Field

component.
Field's will only be

input

input

elements or

textarea

textarea

elements.

The way I have it now, I create signals for the refs, then pass the signal into the

Field

Field

component, which sets the

ref

ref

appropriately:

  let [nameRef, setNameRef] = createSignal<HTMLInputElement>();
  let [emailRef, setEmailRef] = createSignal<HTMLInputElement>();
  let [messageRef, setMessageRef] = createSignal<HTMLTextAreaElement>();

  let [nameRef, setNameRef] = createSignal<HTMLInputElement>();
  let [emailRef, setEmailRef] = createSignal<HTMLInputElement>();
  let [messageRef, setMessageRef] = createSignal<HTMLTextAreaElement>();

        <Field
          label='Name'
          name='name'
          type='text'
          placeholder='Your Name...'
          setRef={setNameRef}
        />
        <Field
          label='Email'
          name='email'
          type='email'
          placeholder='Your Email Address...'
          setRef={setEmailRef}
        />
        <Field
          label='Message'
          name='message'
          type='textarea'
          placeholder='Your Message...'
          setRef={setMessageRef}
        />

        <Field
          label='Name'
          name='name'
          type='text'
          placeholder='Your Name...'
          setRef={setNameRef}
        />
        <Field
          label='Email'
          name='email'
          type='email'
          placeholder='Your Email Address...'
          setRef={setEmailRef}
        />
        <Field
          label='Message'
          name='message'
          type='textarea'
          placeholder='Your Message...'
          setRef={setMessageRef}
        />

Then, the

Field

Field

component: https://sourceb.in/vtBHriCHuF

Is this the best way to do this? Or is there a better option?

SourceBin

Field.tsx

Instantly share your code with the world.

SolidJS•3y ago•

2 replies

werichardson

Better Way to Write This?

Hey y'all! I have some code that works, but I can't help but feel there must be a better way to write it.

I have this form, and I created a

Field

Field

component.
Field's will only be

input

input

elements or

textarea

textarea

elements.

The way I have it now, I create signals for the refs, then pass the signal into the

Field

Field

component, which sets the

ref

ref

appropriately:

  let [nameRef, setNameRef] = createSignal<HTMLInputElement>();
  let [emailRef, setEmailRef] = createSignal<HTMLInputElement>();
  let [messageRef, setMessageRef] = createSignal<HTMLTextAreaElement>();

  let [nameRef, setNameRef] = createSignal<HTMLInputElement>();
  let [emailRef, setEmailRef] = createSignal<HTMLInputElement>();
  let [messageRef, setMessageRef] = createSignal<HTMLTextAreaElement>();

        <Field
          label='Name'
          name='name'
          type='text'
          placeholder='Your Name...'
          setRef={setNameRef}
        />
        <Field
          label='Email'
          name='email'
          type='email'
          placeholder='Your Email Address...'
          setRef={setEmailRef}
        />
        <Field
          label='Message'
          name='message'
          type='textarea'
          placeholder='Your Message...'
          setRef={setMessageRef}
        />

        <Field
          label='Name'
          name='name'
          type='text'
          placeholder='Your Name...'
          setRef={setNameRef}
        />
        <Field
          label='Email'
          name='email'
          type='email'
          placeholder='Your Email Address...'
          setRef={setEmailRef}
        />
        <Field
          label='Message'
          name='message'
          type='textarea'
          placeholder='Your Message...'
          setRef={setMessageRef}
        />

Then, the

Field

Field

component: https://sourceb.in/vtBHriCHuF

Is this the best way to do this? Or is there a better option?

SourceBin

Field.tsx

Instantly share your code with the world.

Better Way to Write This?

Similar Threads

Better Way to Write This?

Similar Threads

Similar Threads

Similar Threads