ant design 中 getFieldDecorator 採坑記

1. 坑一：
報錯：Cannot read property 'getFieldDecorator' of undefined

解決方法：
Form.create()(Questionary) // 用Form.create()加一層

2. 坑二
報錯：'form' is missing in props validation react/prop-types

緣由： 加了代碼檢查工具eslint
解決辦法：

第一步： import PropTypes from 'prop-types'；
第二步： form: PropTypes.any

3. 坑三 怎麼在組件中使用 getFieldDecorator
第一步：父級組件中這麼寫：須要用<Form></Form>嵌套一下

第二步：子組件這麼用：

ShowTextArea () {
    const data = this.props.data
    const validRules = data.textValidate
    const { getFieldDecorator } = this.props.form
    return <FormItem key={data.id}>
      {getFieldDecorator(`textareaValue`, {
        initialValue: validRules.initVal, // 默認文本
        rules: [{
          required: true,
          message: validRules.errMsg // 錯誤信息
        }]
      })(
        <TextArea placeholder="Please enter content" />
      )}
    </FormItem>
 }

當頁面上多個子組件，要保證變量不同，這麼寫：

ShowTextArea () {
    const data = this.props.data
    const validRules = data.textValidate
    const { getFieldDecorator } = this.props.form
    return <FormItem key={data.id}>
      {getFieldDecorator(`textareaValue-${data.id}`, {
        initialValue: validRules.initVal, // 默認文本
        rules: [{
          required: true,
          message: validRules.errMsg // 錯誤信息
        }]
      })(
        <TextArea placeholder="Please enter content" />
      )}
    </FormItem>
 }

未完待續。。。。。