如何從 React-Admin 覆蓋 TextInput

Question

我只想覆蓋特定字段。 設置自定義主題也將覆蓋其他字段。

嘗試使用 useStyles 但沒有用並嘗試使用直接樣式道具但也沒有用。

const useStyles = makeStyles({
    MuiInputBase: {
        root: {
            width: "800px"
        }
    }
});


<TextInput className={classes.MuiInputBase} variant="outlined" label="Search" source="search" alwaysOn />

Answer 1

如文檔中所述， className僅允許覆蓋根組件的樣式。 要覆蓋內部 styles，您必須使用classes屬性：

const useStyles = makeStyles({
    MuiInputBase: {
        root: {
            width: "800px"
        }
    }
});

const MyInput = () => {
   const classes = useStyles();
   return <TextInput classes={classes} variant="outlined" label="Search" source="search" alwaysOn />;
};

更多細節在https://marmelab.com/react-admin/Theming.html#overriding-a-component-style