本文介绍了如果JSON数据中存在数据,请输入onchange检查器的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
添加表单时,我有一个用户要求,应该检查表单名称是否已经存在.如何在es6中做到这一点?我正在使用AntDesign和ReactJS.
I have a user requirement when adding a form it should check if the name of the form is already exist. How can I do that in es6? I'm using AntDesign and ReactJS.
这是我的代码
<Form.Item label="Form Name"> {getFieldDecorator('formName', { rules: [formConfig], })(<Input name="formName" onChange={onChange} />)} </Form.Item>const handleChange = e => { const { name, value } = e.target; setState(() => ({ ...state, [name]: value, })); let isExist = [...formDataSource]; let foundExistItem = isExist.filter( item => item.formName === formName ); };
推荐答案
如果要动态查询表单字段,则应使用 Form.create .
If you want dynamically query the form fields, you should wrap your form with Form.create.
它注入有用的功能,例如onFieldsChange侦听器:
It injects useful functionalities like onFieldsChange listener:
const onFieldsChange = (_, changedFiels) => { const { username } = changedFiels; if (username) { // Make your API checks console.log(`Now changing ${username.name}`); } }; const ValidatedFields = Form.create({ onFieldsChange })(App);注意:您应该使用 getFieldDecorator ,因此在收集表单数据时避免使用onChange.
如果您仍然坚持要控制表单项,则应使用 getFieldValue :
If you still insist to make form items controlled, you should use getFieldValue:
const handleChange = e => { const { name, value } = e.target; const { getFieldValue } = form; setState(() => ({ ...state, [name]: value })); // or use getFieldValue for a single query const values = getFieldsValue(['formName',...more fields]); if (values.length) { // API CALL } };
更多推荐
如果JSON数据中存在数据,请输入onchange检查器
发布评论