鍍金池/ 問答/HTML/ React使用Antd的Select組件動態(tài)變換Option的問題

React使用Antd的Select組件動態(tài)變換Option的問題

有兩個Select選擇框,
第一個Select框的數(shù)據(jù)源是頁面渲染的時候后臺已經(jīng)傳過來的值,
第二個Select框的選項需要根據(jù)第一個的Select框的選擇結(jié)果做動態(tài)改變,
并不是傳統(tǒng)的級聯(lián),第二個Select的Option取決于第一個Select的結(jié)果,是后臺動態(tài)計算后更新給前臺的。

這種情況下,該如何定義第二個Select的Option呢?

回答
編輯回答
有你在

沒有什么不同吧。第一個Select選擇了之后直接ajax,返回的數(shù)據(jù)更新data就可以。
比如:

ajaxCall = () => {
    ajax().then(changeList2)
}

renderOptions = () => {
    return this.props.list.map(element =>
      <Option key={element.id} value={element.id}> {element.address}</Option>);
  };


<Select onclick={ajaxCall}>
    <Option>value1</Option>
</Select>
    
<Select>
    {renderOptions()}
</Select>
2017年11月20日 09:55
編輯回答
苦妄

說白了也只是數(shù)據(jù)的問題的,不需要關(guān)心怎么渲染,只需要關(guān)心數(shù)據(jù)怎么來,怎么轉(zhuǎn)換成Select能渲染的格式

2017年12月21日 08:22