reactjs - Formik sende tilpassede Props til egendefinert Feltkomponent


God kveld alle sammen, jeg har et lite problem med tilpassede Formik-felt..

Jeg bruker et eget tilpasset Field slik som:

<Field name="pdfFile" component={FileUpload} />

FileUpload-egenskaper ser slik ut:

interface FileUploadProps {
    field: FieldInputProps<any>; //These props should probably be derived from Formik
    form: FormikProps<any>;
    width: string;
    height: string;
}

felt og skjema blir korrekt sendt inn i komponenten, men hvordan kan jeg sende inn bredde og høyde i komponenten? Prøvde det slik, men uten suksess.

<Field 
    name="pdfFile" 
    component={(props: any) => (
        <FileUpload
            field={props.field}
            form={props.form}
            width={pdfWidth}
            height={pdfHeight}
        />
    )} 
/>  

Formik API nevner dessverre ikke hvordan man løser dette problemet. Har noen opplevd lignende problemer og vet hvordan man kan løse dette?

Tusen takk for hjelpen!

Svar #1

Hvis du sender en prop til Field som ikke brukes i Field, vil den bli sendt til komponenten i component-propen.

Så du kan gjøre det slik

<Field 
    name="pdfFile" 
    width={pdfWidth}
    height={pdfHeight}
    component={FileUpload} 
/> 

og få verdien i komponentens props

const FileUpload = (props) => {
    // props.width
    // props.height
    return ( /* ... */ )
}

Relaterte artikler