Uncaught TypeError：无法读取undefined的属性'form'

Question

对于JavaScript和React来说，这是一个相当新颖的东西，但一直在玩弄一个UI组件库，它创建一个带有验证的表单，但遇到了一些麻烦。

按照他们的API /文档here我创建使用From.create时应该包含的道具表，但是我得到一个Uncaught TypeError: Cannot read property 'form' of undefined1在checkConfirm功能const form = this.props.form;线这样做的时候。

class CustomizedForm extends React.Component { 
    constructor(...args) { 
    super(...args); 
    } 
    handleSubmit() { 
    e.preventDefault(); 
    this.props.form.validateFields((err, values) => { 
     if (!err) { 
     console.log('Received values of form: ', values); 
     } 
    }) 
    } 
    checkConfirm(rule, value, callback) { 
    console.log(value.length); 
    const form = this.props.form; 
    if (value.length == 11) { 
     form.validateFields(['confirm'], { force: true }); 
    }; 
    callback(); 
    } 

    render() { 
    const { getFieldDecorator } = this.props.form; 
    const formItemLayout = { 
     labelCol: { span: 6 }, 
     wrapperCol: { span: 14 } 
    }; 
    return (
     <div> 
     <Form inline style={{ marginTop: 10, marginBottom: 10 }} onSubmit={this.handleSubmit}> 
      <FormItem 
      {...formItemLayout} 
      hasFeedback 
      > 
      {getFieldDecorator('password', { 
       rules: [{ 
       required: true, message: 'Please input your password!', 
       }, { 
       validator: this.checkConfirm, 
       }], 
      })(
       <Input placeholder="password" /> 
      )} 
      </FormItem> 
      <FormItem hasFeedback> 

      </FormItem> 
      <FormItem   > 
      <Input style={{ width: '200px' }} size="default" placeholder="Shelf Place"></Input> 
      </FormItem> 
      <FormItem> 
      <ProcessSelect /> 
      </FormItem> 
      <FormItem> 
      <ZoneSelect /> 
      </FormItem> 
      <FormItem> 
      <ZalosRangePicker /> 
      </FormItem> 
      <FormItem> 
      <ButtonGroup size="default"> 
       <Button size="default" icon="search" /> 
       <Button size="default" icon="close" /> 
      </ButtonGroup> 
      </FormItem> 
     </Form> 
     </div> 
    ) 
    } 
} 
CustomizedForm = Form.create({})(CustomizedForm); 

Answer 1

我发现了一些错误，在这里，

。错误的原因，

您需要绑定到这个功能类似，

constructor(...args) { 
    super(...args); 
this.checkConfirm = this.checkConfirm.bind(this) 
    } 

功能界定及

checkConfirm(rule, value, callback) { 
    console.log(value.length); 
    const form = this.props.form; 
    if (value.length == 11) { 
     form.validateFields(['confirm'], { force: true }); 
    }; 
    callback(); 
    } 

您没有传递任何安排工作。