如何在reactjs中使用material-ui以红色显示helperText

问题描述

我的目标是在错误时间显示红色的helperText。但是我做不到。 无法找出我要去哪里。

代码如下:

view

Here is the working sample

我不知道为什么它没有显示为红色。在这个问题上苦苦挣扎。 有人可以在这查询中为我提供帮助吗?

解决方法

通过这样的错误提示:

    <FormControl error={!this.state.channel}>
      <Select
        defaultValue={-1}
        onChange={this.handleChange}
        displayEmpty
        inputProps={{ "aria-label": "Without label" }}
      >
        <MenuItem value={-1}>Select Channel</MenuItem>
        <MenuItem value={10}>Sports</MenuItem>
        <MenuItem value={20}>Entertainment</MenuItem>
      </Select>
      {!this.state.channel ? (
        <FormHelperText>{errors.channel}</FormHelperText>
      ) : null}
    </FormControl>

或者就是这样

    <FormHelperText error>{errors.channel}</FormHelperText>

这是文档:https://material-ui.com/api/form-helper-text/