React-Redux-Form设置'错误'支持并使用错误消息作为' helperText' Material-UI TextField中的prop

时间:2018-01-23 16:21:56

标签: reactjs redux material-ui react-redux-form

验证后,我希望能够error支持<Control>组件,以便MUI文本字段为红色并将helperText道具设置为错误消息而不是使用<Errors>组件。

这是我的代码,并提前感谢您的帮助/指导。         ...

    import { Control, Errors } from 'react-redux-form';
    import TextField from 'material-ui/TextField';        

    ...

    const LoginText = props => (<TextField {...props} />);

    class MyLoginComponent extends React.PureComponent {
      render() {

        ...

        return (
        <div>
            <Control
              model="myForms.user.myLogin"
              component={LoginText}
              name="myLogin"
              label="My login"
              placeholder="myLoginFormat"
              className={classes.textField}
              required
              validators={{
                required,
                myIdFormat,
              }}
              validateOn="blur"
            />
            <Errors
              className={[classes.textField, classes.errorMsg].join(' ')}
              model="myForms.user.myLogin"
              component="p"
              show={{ touched: true, focus: false }}
              messages={{
                required: 'Enter your Login ID',
                myIdFormat: 'Please use the My ID format. Ex: myLoginFormat',
              }}
            />

          ...

          </div>
        );
      }
    }      

0 个答案:

没有答案