与 Formik 一起使用时如何禁用 Material UI 中的文本字段

Question

我有一个可重新生成的 Material UI 文本字段，我正在使用我的 formik 表单 -

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

我想禁用我的 reportType。当我像上面那样将 disabled 传递给我的 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={disabled} 传递给 TextField 组件以禁用您的 TextField。

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

与 Formik 一起使用时如何禁用 Material UI 中的文本字段

How to disable a Textfield in Material UI when used with Formik

material-ui

formik