如何在不使用MUIThemeProvider的情况下覆盖material-ui TextField组件的样式?

本文介绍了如何在不使用MUIThemeProvider的情况下覆盖material-ui TextField组件的样式?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

如何使用以下代码隐藏/删除TextField组件中的下划线不:

How would I hide / remove the underline in a TextField component without using the following code:

const theme = createMuiTheme({
  overrides: {
    MuiInput: {
      underline: {
        '&:hover:not($disabled):before': {
          backgroundColor: 'rgba(0, 188, 212, 0.7)',
        },
      },
    },
  },
});

根据文档，我想使用道具: https://material- ui.com/api/input/

I would like to do it with props and according to the docs: https://material-ui.com/api/input/

我应该能够更改下划线道具，但是它不起作用.

I should be able to change the underline prop, but it does not work.

推荐答案

这是您的操作方式:

<TextField
    id="name"
    label="Name"
    value={this.state.name}
    margin="normal"
    InputProps={{disableUnderline: true}}
/>

我怎么知道的?

您已链接到 Input文档，该文档确实具有道具.

You have linked to the Input documentation, which does indeed have a disableUnderline prop.

但是，您使用的是 TextField组件:

However, you are using a TextField component:

FormControl
InputLabel
输入
FormHelperText

FormControl
InputLabel
Input
FormHelperText

如果您查看TextField可用道具的列表:

If you look at the list of available props for TextField:

这篇关于如何在不使用MUIThemeProvider的情况下覆盖material-ui TextField组件的样式?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！