Question

我想要对我的添加信用卡表单进行验证，其中我希望用户在文本字段中的16个字符后无法输入。做这样的事情的最佳方法是什么。

Answer 1

<Input
      value={this.state.cardNo}
      onChange={event => {
        if (event.target.value && event.target.value.length <= 16) {
          this.setState({ cardNo: event.target.value });
        }
      }}
    />;

使用状态和检查长度是＆lt; = 16然后只有setState else离开并将状态值放入输入值，并且在提交值时你可以从状态提交。

注意：您不需要仅使用redux进行客户端验证。

如果是redux形式：

use this reference

import { actions } from 'react-redux-form';

function emailIsValid(email) {
  // terrible validation, I know
  return email && email.length > 0;
}

// in the connected component's render() method...
const { dispatch, user } = this.props;

return
<input type="text"
  onChange={(e) => e.target.value.length <= 16 && dispatch(actions.change('user.email', e))}      
/>

我的建议是不要使用会导致很多性能问题的redux表单

如何在Redux表单文本字段中停止以特定长度键入内容？

1 个答案: