select与input之间转换
/**select选择*/
onChangeSelect = (value: any) => {
this.setState({ sqlyValue: value })
}
/**input输入*/
onChangeInput = (e: any) => {
this.setState({ sqlyValue: e.target.value })
}
dom代码
<Item >
<b><i>*</i>申请理由</b>
// 如果是空,则下拉选择框, 如果不为空,则输入框
{isEmpty(sqlyValue) ?
<Form.Item>
{getFieldDecorator("sqly", {
initialValue: (defaultValue && defaultValue.sqly),
validateTrigger: "onSubmit",
rules: [
{
required: true,
message: "申请理由不可为空!",
},
],
})(
<Select
disabled={globelDisable}
getPopupContainer={(target) => document.querySelector(".nsqzjddl") as HTMLElement}
onChange={this.onChangeSelect}
optionFilterProp="children"
value={defaultValue && defaultValue.sqly as string}
showSearch
allowClear
>
<Select.Option value="1">1111</Select.Option>
<Select.Option value="2">2222</Select.Option>
<Select.Option value="3">3333</Select.Option>
<Select.Option value="4">4444</Select.Option>
<Select.Option value="5">5555</Select.Option>
<Select.Option value="6">6666</Select.Option>
<Select.Option value="7">77777</Select.Option>
</Select>
</Select>
)}
</Form.Item>
:
<Form.Item>
{getFieldDecorator("sqly", {
initialValue: (defaultValue && defaultValue.sqly) ,
validateTrigger: "onSubmit",
rules: [
{
required: true,
message: "申请理由不可为空!",
},
],
})(
<Input allowClear defaultValue={sqlyValue} value={sqlyValue } onChange={this.onChangeInput}/>
)}
</Form.Item>
}
</Item>
代码可参考