Material-UI：如何去掉InputLabel的变换？

Question

尝试删除InputLabela 内部的一些默认转换FormControl，我想知道是否有一种方法可以删除它，而不必一一覆盖每个属性？

例如，以下内容有效，但必须提供覆盖值并保留其他默认值：

createMuiTheme({
    overrides: {
        MuiInputLabel: {
            formControl: {
                position: "unset",
                transform: "none"

我正在寻找一种完全删除属性的方法：

createMuiTheme({
    overrides: {
        MuiInputLabel: {
            formControl: {} <-- as in nothing in formControl, but this does not work

这可以做到吗？

Answer 1

可以设置shrink为falsein InputLabelProps，在编辑时去掉输入标签的变换。

<TextField InputLabelProps={{ shrink: false }} />

但问题是，如果你有任何值，它就会与标签重叠，因为没有转换。解决方案是如果值不为空，则删除标签：

function App() {
  const [value, setValue] = useState("");

  return (
    <TextField
      variant="outlined"
      label={value ? " " : "my label"}
      InputLabelProps={{ shrink: false }}
      value={value}
      onChange={(e) => setValue(e.target.value)}
    />
  );
}

现场演示