在ReactJS中，如何設置一個基於另一個選擇下拉菜單，都是ajax？

Question

具體到初始頁面加載：

在我ReactJS頁我有兩個下拉菜單/ select元素。第一個是通過Ajax加載的，第二個是通過Ajax加載的。第二個選擇中的值取決於在第一個選擇中選擇了哪個值。

這很簡單，可以響應用戶更改第一個選擇，因爲onchange事件被觸發，然後我可以更新第二個下拉菜單。

但我不能解決如何做初始頁面加載。在初始頁面加載期間，將在第一個下拉列表中設置一個值，但我無法弄清楚如何獲取該值，以便可以加載第二個下拉列表的值。

Answer 1

只需發起componentDidMount()中的請求。這會給你一個更新第二選擇的機會。

Answer 2

使用狀態來存儲第一個下拉值。

render() { 
 
let secondDrop = null; 
 
if (this.state.firstDropValue) { 
 
    secondDrop = (
 
    <div id='secondDrop'>... 
 
    ) 
 
else secondDrop = null; 
 
return (
 
    <div id='firstDrop'>...</div> 
 
    {secondDrop} 
 
) 
 
}