antd prepopulate標籤和多選

我正在研究antd選擇和正確預填充問題，我可以通過它的initialValue字段裝飾器預填充選擇框，但它填充字符串，似乎沒有辦法有一個值（我可以解決但不理想），更重要的是，如果該選項未被選中/刪除，它將不再在選擇中可用，與標準選項不同。我可以包含選擇列表選項和初始值（如下面的代碼所示），但它允許重複自動輸入，並在下拉列表中出現兩次。任何想法我做錯了什麼？預選的antd prepopulate標籤和多選

水面浮油和全部選項列表

let defaultSelect = []; 
    let selectList = []; 
    for (var a = 0; a < this.props.myData.length; a++) { 
     //push all options to select list 
     selectList.push(<Select.Option key={this.props.myData[i].id} >{this.props.myData[i].name}</Select.Option>) 
     //this is my code to pre-populate options, by performing a find/match 
     let matchedTech = _.find(this.props.myDataPrepopulate, { id: this.props.myData[i].id }); 
     if (matchedTech) { 
      //notice I can push just the string name, not the name and the id value. 
      defaultSelect.push(this.props.myData[i].name); 
     } 
    }

選擇代碼

{getFieldDecorator(row.name, { 
     initialValue: defaultSelect 
    })(
    <Select 
     tags 
     notFoundContent='none found' 
     filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0} 
     {selectList} 
    </Select> 
    )}

來源

2017-04-20 edencorbin

您發佈的代碼中有許多語法錯誤：我未定義，<選擇標籤未關閉等。 –

我想我明白你的問題，即使你貼不運行的代碼。

<Select.Option>與普通html <select><option/></select>一樣工作。爲了給該選項一個值，它需要一個value屬性，該屬性用於標識該選項。

查看http://codepen.io/JesperWe/pen/YVqBor的工作示例。

轉化爲您的示例中的關鍵部分將變成：

this.props.myData.forEach(data => { 
    selectList.push(<Select.Option value={data.id} key={data.id}>{data.name}</Select.Option>); 
}); 

defaultSelect = this.props.myDataPrepopulate.map(data => data.id);

（我冒昧地使用一些更現代的代碼模式比原來的）

來源

2017-04-21 12:27:28

antd prepopulate標籤和多選

回答

相關問題