Как отключить текстовое поле в пользовательском интерфейсе материала при использовании с Formik

Question

У меня есть готовое текстовое поле Material UI, которое я использую с моей формой formik -

<Fieldname="reportType"
    label="Report Type"
    disabled
    as={TextFieldOutLined}
/>

Я хочу отключить свой reportType. Когда я передаю отключенный, как указано выше, на свой TextFieldOutLined, он не работает.

Ниже мой фрагмент TextFieldOutLined.

const TextFieldOutLined = ({ label, disabled, ...props }) => {
    const classes = useStyles();

    const [field] = useField(props);
    return (
        <TextField
            className={classes.formControl}
            {...field}
            {...disabled}

Answer 1

Вы должны передать disabled={disabled} вашему TextField компоненту, чтобы отключить TextField, когда значение disabled prop истинно.

<TextField
    className={classes.formControl}
    {...field}
    disabled={disabled}