选择字段中的动态选项与反应

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