Material ui 导出带高度的样式材料UI文本字段？

此问题似乎应用了以下文本字段：variant='outlined' . 我正在尝试导出高度为40px的我自己的大纲文本字段：

import { withStyles } from '@material-ui/core/styles';
import TextField from '@material-ui/core/TextField';


const MyTextField = withStyles({
    root: {
        backgroundColor: 'yellow',
        height: 40,
        margin: 0,
        paddingBottom: 0,
        marginTop: 0,
    }
})(TextField);

export default MyTextField;

我将该组件用作大纲文本字段，因为从样式化组件导出variant='roughted'似乎不起作用

<MyTextField 
  value={"hello"}
  variant="outlined"
/>

---

轮廓文本字段的高度大于40px，因为字段底部有额外的填充；但是背景黄色现在只有40px。如何更改概述的文本字段的高度？

恭喜！当您隔离代码时，它的工作方式完全符合您的需要。当放入沙箱时，

显示的高度为40px。应用程序中的其他内容导致了高度问题。

在仅更改高度的同时是否要保持文本大小不变？我没有使用普通文本字段进行测试，因为我的应用程序使用“轮廓”文本字段。当我使用variant=“概述”时，问题就出现了。这似乎在文本字段的底部添加了一些填充。这就是使字段比未列出的字段更大的原因。如何将variant=outlned按钮的样式设置为特定高度？计算出轮廓变量使用的填充量，并将TextField height设置为40-（轮廓变量填充）。这应该能奏效。如果使用标签，它可能会弄乱标签与文本的重叠。