antd事前集計タグとマルチセレクト

Question

私はantd selectで作業していますが、これを正しくプリペイントすることに問題があります。選択フィールドをinitialValueフィールドデコレータで事前入力することはできますが、文字列が入力されるため、 （私は回避できますが、理想的ではない）価値があります。さらに重要なことに、オプションが選択されていない/削除されている場合、標準オプションとは異なり、selectオプションでは使用できなくなります。選択リストオプションと初期値の両方に含めることができます（以下のコードで説明します）。ただし、自動入力が重複し、ドロップダウンリストに2回表示されます。私が間違っていることは何ですか？

事前に選択されたのPreperationとフルオプションリスト

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> 
    )} 

Answer 1

私はあなたが実行されないコードを掲示していても、私はあなたの質問を理解すると思います。

<Select.Option>は、プレーンhtml <select><option/></select>のように動作します。オプションに値を与えるには、オプションを識別するために使用されるvalue属性が必要です。

実例はを参照してください。あなたの例に変換

重要な部分はなる：

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);