For Component

DaOfficialWizard🧙 · 2022-12-19T13:45:46.927Z

Hello ya'll, i have a ` ` component with the following error: ```bash This JSX tag's 'children' prop expects a single child of type '(item: Iinputs, index: Accessor ) => Element', but multiple children were provided. ``` With the following code: ```ts interface FormProps { ... inputs: Iinputs[] ... } const FormComponent: Component = (props) => { return ( {(input) => input.input()} ) } ``` My interfaces look like this: ```ts export interface Iinternal { errorMsg?: string error?: boolean } export interface Iinputs { input: (props?: Iinternal) => JSXElement } ``` I plan on passing in an array that looks like this: ```ts export const inputs: Iinputs[] = [ { input: (props?: Iinternal) => ( ), }, ] ``` Any help would be appreciated - new to SolidJS.

Hello ya'll, i have a

<For>

<For>

component with the following error:

This JSX tag's 'children' prop expects a single child of type '(item: Iinputs, index: Accessor<number>) => Element', but multiple children were provided.

This JSX tag's 'children' prop expects a single child of type '(item: Iinputs, index: Accessor<number>) => Element', but multiple children were provided.

With the following code:

interface FormProps {
    ...
    inputs: Iinputs[]
    ...
}

const FormComponent: Component<FormProps> = (props) => {
    return (
       <div class="flex-it">
           <For each={props.inputs}> {(input) => input.input()}</For>
        </div>
    )
}

interface FormProps {
    ...
    inputs: Iinputs[]
    ...
}

const FormComponent: Component<FormProps> = (props) => {
    return (
       <div class="flex-it">
           <For each={props.inputs}> {(input) => input.input()}</For>
        </div>
    )
}

My interfaces look like this:

export interface Iinternal {
    errorMsg?: string
    error?: boolean
}

export interface Iinputs {
    input: (props?: Iinternal) => JSXElement
}

export interface Iinternal {
    errorMsg?: string
    error?: boolean
}

export interface Iinputs {
    input: (props?: Iinternal) => JSXElement
}

I plan on passing in an array that looks like this:

export const inputs: Iinputs[] = [
    {
        input: (props?: Iinternal) => (
            <Inputs label="Email" type="password" name="password" id="password" {...props} />
        ),
    },
]

export const inputs: Iinputs[] = [
    {
        input: (props?: Iinternal) => (
            <Inputs label="Email" type="password" name="password" id="password" {...props} />
        ),
    },
]

Any help would be appreciated - new to SolidJS.

For Component

Hello ya'll, i have a

<For>

<For>

component with the following error:

This JSX tag's 'children' prop expects a single child of type '(item: Iinputs, index: Accessor<number>) => Element', but multiple children were provided.

This JSX tag's 'children' prop expects a single child of type '(item: Iinputs, index: Accessor<number>) => Element', but multiple children were provided.

With the following code:

interface FormProps {
    ...
    inputs: Iinputs[]
    ...
}

const FormComponent: Component<FormProps> = (props) => {
    return (
       <div class="flex-it">
           <For each={props.inputs}> {(input) => input.input()}</For>
        </div>
    )
}

interface FormProps {
    ...
    inputs: Iinputs[]
    ...
}

const FormComponent: Component<FormProps> = (props) => {
    return (
       <div class="flex-it">
           <For each={props.inputs}> {(input) => input.input()}</For>
        </div>
    )
}

My interfaces look like this:

export interface Iinternal {
    errorMsg?: string
    error?: boolean
}

export interface Iinputs {
    input: (props?: Iinternal) => JSXElement
}

export interface Iinternal {
    errorMsg?: string
    error?: boolean
}

export interface Iinputs {
    input: (props?: Iinternal) => JSXElement
}

I plan on passing in an array that looks like this:

export const inputs: Iinputs[] = [
    {
        input: (props?: Iinternal) => (
            <Inputs label="Email" type="password" name="password" id="password" {...props} />
        ),
    },
]

export const inputs: Iinputs[] = [
    {
        input: (props?: Iinternal) => (
            <Inputs label="Email" type="password" name="password" id="password" {...props} />
        ),
    },
]

Any help would be appreciated - new to SolidJS.

For Component

Similar Threads

For Component

Similar Threads

Similar Threads

Similar Threads