使用数组反应用按钮填充 ButtonGroup

Question

我正在尝试使用 array.map() 为 ButtonGroup 填充按钮，但按钮没有显示。我使用完全相同的方法用 MenuItems 填充 DropdownButton 没有问题。

工作的 DropdownButton 在这里：

<DropdownButton title={this.state.regionallevel} onSelect={(evt)=>{
                this.setState({regionallevel: evt}, () => {
                    this.sendNewScenarios();
                })}}>
                {regionalLevels.map((regionalleveli, i) =>
                    <MenuItem eventKey={regionalleveli} key={i}>{regionalleveli}</MenuItem>)}
            </DropdownButton>  

这里是不工作的 ButtonGroup：

<ButtonGroup vertical>
                {scenarios.map=((scenarioi, i) =>
                    <Button color="default" key={i} onClick={() => this.onCheckboxBtnClick(scenarioi)} active={this.state.checkboxesSelected.includes(scenarioi)}>{scenarioi}</Button>)}
            </ButtonGroup>

如果我这样做，ButtonGroup 确实可以工作，但我需要它是动态的：

<ButtonGroup vertical>
                <Button color="default" onClick={() => this.onCheckboxBtnClick(scenarios[0])} active={this.state.checkboxesSelected.includes(scenarios[0])}>{scenarios[0]}</Button>
                <Button color="default" onClick={() => this.onCheckboxBtnClick(scenarios[1])} active={this.state.checkboxesSelected.includes(scenarios[1])}>{scenarios[1]}</Button>
                <Button color="default" onClick={() => this.onCheckboxBtnClick(scenarios[2])} active={this.state.checkboxesSelected.includes(scenarios[2])}>{scenarios[2]}</Button>
            </ButtonGroup>

组件是从 react-bootstrap 导入的。问题可能出在哪里？

更新：好的，我不知道为什么，但是 ButtonGroup 现在可以正常工作，即使我根本没有更改代码。但是还有另一个 ButtonGroup 应该以相同的方式工作，但没有。代码如下：

<ButtonGroup vertical>
                {periods.map=((periodi, i) =>
                    <Button color="default" key={i} onClick={() => this.onRadioBtnClick(periodi)} active={this.state.radioButtonSelected===periodi}>{periodi}</Button>)}
            </ButtonGroup>

这是控制台显示的内容。第 95 行是上面的 ButtonGroup 开始的地方：

Warning: Functions are not valid as a React child. This may happen if you return a Component instead of <Component /> from render. Or maybe you meant to call this function rather than return it.
in div (created by ButtonGroup)
in ButtonGroup (at DropdownMenuScenarios.js:95)
in div (at DropdownMenuScenarios.js:56)
in DropdownMenuScenarios (at App.js:36)
in div (at App.js:29)
in App (at index.js:7)

Answer 1

你有一个错字（一个额外的=）。所以：

 periods.map((periodi, i) => ....

而不是

 periods.map=((periodi, i) => ...

这就是错误很明显的原因：Functions are not valid as a React child.