reactjs 解决前后输入框中的内容不能重复的问题

 1、两个关联的输入框，输入的内容不能重复，重复了的话，会给出提示，并且还提交不了

以下代码仅供参考，每个公司都有自己的一套代码框架

重要在于这个：    validator: newLawyerId   

                参考下面Antd组件中Form  (滑到最下面的校验规则里的validator)

validator  自定义校验（callback必须被调用）

newLawyerId  随意定义的一个方法名

 Ant Design 组件： 选择器 Select - Ant Design

import React from 'react'
import { connect } from 'apollo'
import { Form, Row, Col, Card, message, Button } from 'antd'

const FormItem = Form.Item

class UpdateLawyerView extends React.Component {
     // 提交
    submit = () => {
        this.props.form.validateFields((error, values) => {
            if(!error){
                message.info("新旧律师职业证书号重复了!")
            } else {
                this.props.modifyLawyerId(values)
            }
        })
    }

    // 重置
    reset = () => {
        this.props.form.resetFields()
    }

    render () {
        const { getFieldDecorator } = this.props.form
        const newLawyerId = (rule, value, callback) => {
            // value指新输入的，val指旧的
            const val = this.props.form
            if( value && value === val.getFieldValue('oldLawyerId') ){
                callback('新旧律师职业证书号重复了!')
            } else {
                callback()
            }
        }

    return (

        <div>
          <Card title="13.修改律师职业证书号">
            <Form>
              <Row>
                <Col span={10}>
                  <FormItem label="旧律师职业证书号">
                    {getFieldDecorator('oldLawyerId', {
                      rules: [
                        {
                          required: true,
                          message: '请输入旧律师职业证书号'
                        },
                      ],
                    })( <Input placeholder="请输入旧律师职业证书号" allowClear /> )}
                  </FormItem>
                </Col>
                <Col span={10}>
                  <FormItem label="新律师职业证书号">
                    {getFieldDecorator('newLawyerId', {
                      rules: [
                        {
                          required: true,
                          message: '请输入新律师职业证书号'
                        },
                        {
                          validator: newLawyerId,
                        },
                      ],
                    })( <Input placeholder="请输入新律师职业证书号" allowClear /> )}
                </FormItem>
            </Col>
            <Col span={4}>
                <div>
                    <Button type="primary" onClick={this.submit}>提交</Button>
                    <Button type="primary" onClick={this.reset}>重置</Button>
                </div>
            </Col>
           </Row>
         </Form>
       </Card>
    </div>
    )
  }
}

const mapStateToProps = ({ commonlyUsedFunctions }) => ({ ...commonlyUsedFunctions })
const mapDospatchToProps = dispatch => ({
    modifyLawyerId(values){
        dispatch({
            type: 'commonlyUsedFunctions/updateLawyerId',
            payload: {
                values,
            },
            async: true,
        })
    }
})

export default connect(mapStateToProps, mapStateToProps)(Form.create()(UpdateLawyerView ))