当没有值时，在选择控件中显示空选项

Question

class Index extends React.Component {

    constructor(props) {
        super(props);
        
        this.state = {
          records:[],  
        } 
    }
.....
render() {
const columns = [
      {
        title: 'ID',
        dataIndex: 'ID',
        key: 'ID',
        sorter: (a, b) => a.ID - b.ID,
        render: (val)=><div title={val} className="text_overlap">{val}</div>
      },{
        title: 'Module',
        dataIndex: 'Description',
        key: 'Description',
        sorter: false,
        render: (val, record, index) => <div title={'Module: ' + val} className="text_overlap d-flex">
             
              {record.IsEdit ? <Select mode="multiple"
              style={{ width: '80%' }}
              value={this.state.descr}
              placeholder="Please select"
              onChange={(e) => {this.setState({set:true, descr:e});}}
              filterOption={(input, option) =>
                option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
              }>
              {this.state.Modules && this.state.Modules.map((d) => <Select.Option value={d.Description}>{d.Description}</Select.Option>)}
            </Select>  : <div style={{maxWidth:'90%',overflow:'hidden', textOverflow:'ellipsis'}}>{val && val.join(', ')}</div>}
            {!record.IsEdit && <div className="mx-2" style={{ cursor: 'pointer' }} title={"Edit"} onClick={() => { this.doEdit(record,index); this.setState({descr:record.Description}) }}><i className="fa fa-edit" style={{  fontSize:17, marginTop: 0 }}></i></div>}
            {record.IsEdit && <div className="mx-2 pt-1" style={{ cursor: 'pointer' }} title={"Save"} onClick={() => { this.updateRecord(record); this.setState({descr:''}) }}><i style={{fontSize:17}} className={this.state.updating ? "fa fa-spin fa-spinner" : "fa fa-save"}></i></div>}
            {record.IsEdit && <div className="mx-2 pt-1" style={{ cursor: 'pointer' }} title={"Cancel"} onClick={() => { this.doCancel(record); this.setState({descr:''}) }}><i style={{fontSize:17}} className="fa fa-times"></i></div>}
              </div>
      }
      
    ];

我的网格中有一个可编辑的列。但是，如果后端没有值，则在某些情况下显示一个空的选项。如果有价值，则没有问题。如何删除该空值？我正在使用antd。

Answer 1

如果this.state.descr没有任何值，请将其null。

Answer 2

也许您可以在this.state.length＆gt;的渲染方法中添加条件渲染。 0