本文出自：

先給案例：

<FormItem
    {...formItemLayout}
    label="銷售方式"
>
    {getFieldDecorator('is_alone_buy', {
        rules: [{
            required: true, message: '請選擇銷售方式',
        }],
    })(
        <Checkbox >單獨購</Checkbox>
    )}

    {getFieldDecorator('is_group_buy')(
        <MyCheckBox
 
            onChange={this.onFormSetting}
            text="階梯團購"/>
    )}

</FormItem>

這邊的is_alone_buy是不能賦值到Checkbox上面的，為什麼呢？請留意

元件中有checked屬性，並沒有我們一貫使用的value屬性。

個人理解(因為我並沒有再去檢視antd的文件)：

1. getFieldDecorator()()，該方法第一個方法執行完畢會自動給第二個括號內新增value屬性，同時監聽onChange()
2. 所以剛剛上面講了Checkbox是沒有value屬性的。即getFieldDecorator()()沒有辦法把選中的值給Checkbox

問題解決方案：

class MyCheckBox extends React.Component {

    render() {
        return (
            <Checkbox
                checked={this.props.value}
                onChange={this.props.onChange}>
                {this.props.text}
            </Checkbox>
        );
    }
}

• 自定義一個元件，來接收this.props.value屬性，改變為checked屬性
• 監聽Checkbox的onChange屬性，供getFieldDecorator()()方法監聽

至此問題已經解決，其餘的元件，如果沒有onChange/value都可以參考此部落格進行改善。

/////////////////////2017/5/17更新////////////////////////

這邊搜尋switch

options.valuePropName 子節點的值的屬性，如 Switch 的是 ‘checked’

<FormItem
    label="圖片"
    labelCol={{span: 6}}
    wrapperCol={{span: 18}}
>
{
    getFieldDecorator('goods_img', {
        valuePropName: 'fileList',
        rules: [{required: true, message: '必填', type: 'array'}],
    })(
        <FileUploader multiple={false}/>,
    )
}
</FormItem>

• 注意這邊的valuePropName,是把 goods_img 的名字給轉換成了 fileList 這樣就能被FileUploader 識別
• switch 的 valuePropName可以修改成checked，此時不寫元件也達到了效果