我想拥有读心术���� 2019-02-11 16:19
浏览 4078

react antd封装的select 三级联动清空 上级改变 下级清空

封装的search的select部分

getFieldItem (configItem) {
const { getFieldDecorator } = this.props.form
switch (configItem.type) {
case 'select': {
return (

        {
          getFieldDecorator(configItem.value, { rules: [], initialValue: configItem.defaultValue ? configItem.defaultValue : configItem.defaultValue })(
            <Select
              placeholder={configItem.placeholder} onChange={configItem.onChange}
              style={{ width: configItem.width || 120 }}>
              {
                (configItem.options || []).map(item =>
                  <Option key={item.value} value={item.value}>{item.label}</Option>
                )
              }
            </Select>
          )
        }
      </Form.Item>
    )
  }

页面引用封装的函数做三级联动

        this.formConfigs = [
  { value: 'palces', onChange: (e, val) => this.onchages(e, val), width: 200, placeholder: '现居住场所', type: 'select', options: [] },
  { value: 'placeTaypsaeName', onChange: (e, val) => this.onchageBuilding(e, val), width: 200, placeholder: '选择楼号', type: 'select', options: [] },
  { value: 'nationCode', onChange: (e, val) => this.onchageUnit(e, val), placeholder: '选择单元', type: 'select', options: [] },
  { value: 'carColors', width: 145, placeholder: '选择房间', type: 'select', options: [] } // { value: 'carType', placeholder: '现居住地', type: 'select', options: carTypeOptions },
]

** 其中的一个 onchange事件**

 onchages (e, val) {
let transformArray = []
httpClient.post('地址', { BelongedPlace: e })
  .then(result => {
    let data = result.data || []
    data.forEach((data) => {
      transformArray.push({ label: data['name'], value: data['name'], class: 'BelongedPlace' })
    })
    this.setState({
      list1: transformArray
    })
  })

}

  • 写回答

0条回答 默认 最新

    报告相同问题?

    悬赏问题

    • ¥15 逻辑谓词和消解原理的运用
    • ¥15 三菱伺服电机按启动按钮有使能但不动作
    • ¥15 js,页面2返回页面1时定位进入的设备
    • ¥200 关于#c++#的问题,请各位专家解答!网站的邀请码
    • ¥50 导入文件到网吧的电脑并且在重启之后不会被恢复
    • ¥15 (希望可以解决问题)ma和mb文件无法正常打开,打开后是空白,但是有正常内存占用,但可以在打开Maya应用程序后打开场景ma和mb格式。
    • ¥20 ML307A在使用AT命令连接EMQX平台的MQTT时被拒绝
    • ¥20 腾讯企业邮箱邮件可以恢复么
    • ¥15 有人知道怎么将自己的迁移策略布到edgecloudsim上使用吗?
    • ¥15 错误 LNK2001 无法解析的外部符号