解決antdeisgn的form表單中checkbox項無法初始化的問題
阿新 • • 發佈:2019-02-06
Form表單的單一FormItem定義如下:
<FormItem label="是否啟用" {...formItemLayout}> {getFieldDecorator('useable',{ rules:[{ required:true,message:'是否啟用' }], initialValue: this.state.useableChecked })( <WrapedCheckBox onChange={this.onUseableCheckedChange}/> )} </FormItem>
但是因為checkbox無value配置項,所以自定義checkbox如下:
class WrapedCheckBox extends Component { render() { let status = true; if (this.props.value === false || this.props.value === 'false') status=false; return ( <Checkbox checked={status} onChange={this.props.onChange}> {this.props.text} </Checkbox> ); } } export default WrapedCheckBox;
因為checkbox的checked屬性只能識別bool型的false,無法識別字符型的false,所以在render中做一次強制資料轉換。