我想拥有读心术���� 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 stable diffusion
    • ¥100 Jenkins自动化部署—悬赏100元
    • ¥15 关于#python#的问题:求帮写python代码
    • ¥20 MATLAB画图图形出现上下震荡的线条
    • ¥15 关于#windows#的问题:怎么用WIN 11系统的电脑 克隆WIN NT3.51-4.0系统的硬盘
    • ¥15 perl MISA分析p3_in脚本出错
    • ¥15 k8s部署jupyterlab,jupyterlab保存不了文件
    • ¥15 ubuntu虚拟机打包apk错误
    • ¥199 rust编程架构设计的方案 有偿