Можно ли изменить цвет шрифта TextField в material-ui-next? - PullRequest
0 голосов
/ 08 мая 2018

Я сейчас использую material-ui-next

И у меня возникают проблемы при попытке изменить цвет шрифта многострочного TextField.

<TextField className = "textfield"
           fullWidth
           multiline
           label   = "Debugger"
           rows    = "10"
           margin  = "normal"/>

и css:

.textfield {
    background-color: #000;
    color: green;
}

Однако почему-то у меня только черный фон, а шрифт все еще черный. Кто-нибудь знает, как правильно изменить цвет шрифта текстового поля с помощью material-ui-next?

Ответы [ 3 ]

0 голосов
/ 08 мая 2018

Я ссылался на эту страницу TextField API

И я перезаписываю TextField, используя Классы

const styles = theme => ({
    multilineColor:{
        color:'red'
    }
});

Применение класса к TextField с использованием InputProps.

<TextField 
  className = "textfield"
  fullWidth
  multiline
  InputProps={{
    className: classes.multilineColor
  }}
  label   = "Debugger"
  rows    = "10"
  margin  = "normal" />

РЕДАКТИРОВАТЬ В более старой версии вы должны указать ключ input

<TextField 
    className = "textfield"
    fullWidth
    multiline
    InputProps={{
        classes: {
            input: classes.multilineColor
        }
    }}
    label   = "Debugger"
    rows    = "10"
    margin  = "normal"
/>

Надеюсь, это сработает.

0 голосов
/ 30 июня 2019

Как установить свойство цвета и свойство фона текстового поля

import PropTypes from "prop-types";
import { withStyles } from "@material-ui/core/styles";
import TextField from "@material-ui/core/TextField";

const styles = {
  root: {
    background: "black"
  },
  input: {
    color: "white"
  }
};

function CustomizedInputs(props) {
  const { classes } = props;

  return (
    <TextField
      defaultValue="color"
      className={classes.root}
      InputProps={{
        className: classes.input
      }}
    />
  );
}

CustomizedInputs.propTypes = {
  classes: PropTypes.object.isRequired
};

export default withStyles(styles)(CustomizedInputs);
0 голосов
/ 08 мая 2018

Попробуйте ниже CSS

 .textfield{
     color: #000;
    }
...