Как решить проблему перекрытия меток для материала-пользовательского интерфейса? - PullRequest
0 голосов
/ 09 мая 2019

Я новичок в React ... Я думаю, что код верен, но у меня есть этот ярлык, перекрывающийся с контуром выбора: Изображение выпуска

class NativeSelects extends React.Component {

  constructor(props) {
    super(props)
    this.state = {
      grupo: '',
      name: 'hai',
      labelWidth: 0,
    };
  }

  componentDidMount() {
    this.setState({
      labelWidth: ReactDOM.findDOMNode(this.InputLabelRef).offsetWidth,
    });
  }

  render() {
    const { classes } = this.props;

    return (
      <form className={classes.root}>

        <FormControl variant="outlined" className={classes.formControl}>
          <InputLabel
            ref={ref => {
              this.InputLabelRef = ref;
            }}
            htmlFor="outlined-age-simple"
          >Selecciona un grupo</InputLabel>
          <Select
            value={this.props.grupo}
            onChange={(e)=>this.props.handleChange(e.target.value)}
            input={
              <OutlinedInput
                name="grupo"
                labelWidth={this.labelWidth}
                id="outlined-age-simple"
              />
            }
          >
            <MenuItem value="" />
            <MenuItem value={1} >Fundamentos de Programacion</MenuItem>
            <MenuItem value={2} >Programacion Aplicada</MenuItem>
            <MenuItem value={3} >Taller de Desarrollo de Aplicaciones</MenuItem>
          </Select>
        </FormControl>
      </form>
    );
  }
}

NativeSelects.propTypes = {
  classes: PropTypes.object.isRequired,
};

export default withStyles(styles)(NativeSelects);

Я только хочу, чтобы исчезло перекрытие.Спасибо за все, я хочу узнать больше о React!

...