SolidJSS
SolidJSโ€ข10mo agoโ€ข
3 replies
Grahf

Correct type for props.children?

I have wrapper component that wraps an <input> in one component and a <select> in another component.

It takese these props:

type Props = {
action: string
workRequestId: string
children: JSXElement
}

Then it's used like this:
    <UpdateWork
      action='updateWorkAssignment'
      workRequestId={props.workRequestId}
    >
      <input/>
    </UpdateWork>


    <UpdateWork action='updateWorkStatus' workRequestId={props.workRequestId}>
      <select/>
    </UpdateWork>


I want to capture the name attribute of the input and select in the wrapper. When I try and do that TS says: ts: Property 'name' does not exist on type 'number | boolean | Node | ArrayElement | (string & {})'.
Property 'name' does not exist on type 'number'.

When I change the type to HTMLFormElement the children say:
ts: This JSX tag's 'children' prop expects type 'HTMLFormElement' which requires multiple children, but only a single child was provided.
Was this page helpful?