表单创建时候的写法
因为不是编辑模式,不用根据服务器端数据,进行已经选项 -- 可选列表 的映射关系,所以创建的时候,没有问题。 但编辑的时候,因为 getFieldDecorator 里面直接包装的如果是 Spin 元素的话,就凉了
<Form.Item label="选择学校" {...formItemLayout} extra={
// TODO
this.props.querySchoolList_loading &&
<Icon type="loading" style={{ fontSize: 24 }} />
}>
{getFieldDecorator(`selected_school_id`, {
})(
? <Spin spinning={this.props.querySchoolList_loading} indicator={<Icon type="loading" style={{ fontSize: 16 }} spin />}>
{
this.props.querySchoolList_loading &&
<Radio.Group onChange={this.handleSelectSchool}>
{
schoolList.map(option => <Radio value={option.id} key={option.id}>{option.name}</Radio>)
}
</Radio.Group>
}
</Spin>
)}
</Form.Item>
正确写法
<Form.Item label="选择学校" {...formItemLayout} extra={
// TODO
this.props.querySchoolList_loading &&
<Icon type="loading" style={{ fontSize: 24 }} />
}>
{getFieldDecorator(`selected_school_id`, {
})(
this.props.querySchoolList_loading
? <Spin spinning={this.props.querySchoolList_loading} indicator={<Icon type="loading" style={{ fontSize: 16 }} spin />}>
</Spin>
: <Radio.Group onChange={this.handleSelectSchool}>
{
schoolList.map(option => <Radio value={option.id} key={option.id}>{option.name}</Radio>)
}
</Radio.Group>
)}
</Form.Item>