reactjs - 如何使用 Redux 表单验证名称字段中的表单重复名称?
问题描述
import React from 'react'
import { Field, reduxForm } from 'redux-form'
const required = value => value ? undefined : 'Required'
const renderField = ({ input, label, type, meta: { touched, error, warning } })=> (
<div>
<label>{label}</label>
<div>
<input {...input} placeholder={label} type={type}/>
{touched && ((error && <span>{error}</span>) ||
(warning && <span>{warning}</span>))}
</div>
</div>
)
const FieldLevelValidationForm = (props) => {
const { handleSubmit, pristine, reset, submitting } = props
return (
<form onSubmit={handleSubmit}>
<Field name="username" type="text"
component={renderField} label="Username"
validate={[ required, maxLength15 ]}
/>
<div>
<button type="submit" disabled={submitting}>Submit</button>
<button type="button" disabled={pristine || submitting}
onClick={reset}>Clear Values</button>
</div>
</form>
)
}
export default reduxForm({form: 'fieldLevelValidation'})
(FieldLevelValidationForm)
当前实现缺少重复的用户名条目输入验证。我想知道如何定义验证表单中重复的用户名字段输入的逻辑?
解决方案
你可以在这里asyncValidate
使用in 。此外,您应该在验证中使用调度。你应该这样做:reduxForm
const asyncValidate = (values, dispatch) => {
//using dispatch here
}
推荐阅读
- normalization - 如何使用 jmespath 从 json 中获取所有名为 ref 的属性?
- python - 我将如何创建一个函数来检查坐标是否在某个地图边界内?
- sql-server-data-tools - 数据库名称作为文件组文件名的一部分
- visual-studio - 在 Visual Studio/msbuild 中,一个目标框架的构建事件如何依赖于另一个?
- linux - kex_exchange_identification:远程主机使用 ~/.ssh/config 文件关闭连接
- tomcat - 如何更改 Tomcat 的 undeployOldVersions 超时?
- c# - 如何在 C# Nest 中将日期值发送到 elasticsearch 聚合查询
- azure - 将 Azure AD 用户与 Gsuite 关联
- haskell - 我们如何在保持类型安全的同时通用地处理关联类型
- docker - ECS Fargate 公共 IP 连接被拒绝