首页 文章

如何使用Material-ui @ next TextField错误道具

提问于
浏览 次
5

我想使用Material-UI Next textfield error props link，道具类型是 boolean . 以前版本的Material-UI道具名称是 errorText ，道具类型是 node link .

使用 errorText 道具的Textfield Material-UI以前的版本：

<TextField
  name='name'
  floatingLabelText='Name'
  hintText='Type your name'
  value={this.state.fields.name}
  onChange={this.onChange}
  errorText={this.state.error}
/>

使用Material-UI先前版本中的 errorText ，该代码适用于显示错误状态 .

Textfield Material-UI接下来使用 error 道具：

<TextField
  name='name'
  label='Name'
  placeholder='Type your name'
  value={this.state.fields.name}
  onChange={this.onChange}
  error={true} //only accept true or false value
/>

在Material-UI Next errorText props以boolean类型更改为 error ，并且只接受true或false值 . 如果我将 error 道具设置为true，则文本字段随时显示错误状态 . 我只想在某些条件下显示错误状态 .

如何在Material-UI Next textfield上使用错误状态 this.state.error ？

material-ui

1 回答

  • 12

    使用react组件状态，可以存储 TextField 值并将其用作错误的指示符 . Material-UI公开 error 和 helperText props以交互方式显示错误 .

    看一下下面的例子：

    <TextField
  value={this.state.text}
  onChange={event => this.setState({ text: event.target.value })}
  error={text === ""}
  helperText={text === "" ? 'Empty field!' : ' '}
/>
    回复于

相关问题