選擇字段中的動態選項與反應

Question

我試圖用ReactJS解決下一個任務：讓我們假設我有幾個問題和答案字段。我希望能夠在頁面上的所有答案之間分發10分。

我做了一個表格，其中包括幾個<select>字段，根據當前用戶輸入狀態，將動態填充<option>標記。

問題是，當用戶選擇值時，它們將被重置爲零。 請在這裏看到一個代碼示例，並儘量選擇一些值： https://jsfiddle.net/jcpyqf9v/1/

Answer 1

你的問題是由填充您選擇的選項，在這裏造成的：

let optionNodes = []; 
for (let k = 0; k < 11 - pointsSum; k++) { 
    optionNodes.push(<option key={k} value={k}>{k}</option>); 
} 

由於您只outputing一個子集的選項中，如果選擇的選項不在列表中，則選擇字段別無選擇，只能輸出默認值; 0。

試試這個，而不是;

let optionNodes = []; 
for (let k = 0; k < 11 - pointsSum || k <= this.state.answers[i]; k++) { 
    optionNodes.push(<option key={k} value={k}>{k}</option>); 
}