Reactjs 使React属性不绑定到特定变量

我试图通过for循环创建一组react元素。然而，似乎不是每个元素都获得每个for循环的变量的副本，而是将它们绑定到for循环末尾i=3的变量。我怎样才能防止这种情况。谢谢

makeCheckboxes() {
    var checkboxes = [];
    for(var i = 0; i < this.props.flagNames.length; i++) {
        console.log("Making checkbox. i = " + i);
        checkboxes.push((
            <React.Fragment>
                <label><input type="checkbox" name="reportFlags" value="fraud" checked={this.state.reportFlags[i]} onClick={() => this.handleCheck(i)}/>{this.props.flagNames[i]} </label><br />
            </React.Fragment>
        ));
    }
    return checkboxes;
};

替换

forvar i=0；i 借

forlet i=0；i 事实上，它会造成一个关闭，所以它应该解决这个问题

如果您仍然想使用var，您可以使用立即调用的函数表达式iife像这样更改代码

---

使用“let”而不是“var”。“let”是块作用域。请参见此处

for(var i = 0; i < this.props.flagNames.length; i++) {
    console.log("Making checkbox. i = " + i);
    checkboxes.push((
        <React.Fragment>
            <label>
               <input 
                  type="checkbox" 
                  name="reportFlags" 
                  value="fraud" 
                  checked={this.state.reportFlags[i]} 
                  onClick={((j) => () => this.handleCheck(j))(i)} //here is the iife
               />
               {this.props.flagNames[i]} 
            </label><br />
        </React.Fragment>
    ));
}
return checkboxes;