如何在带有react的Array.map（）函数内部使用箭头函数

Question

我已经在我的React应用程序中使用了map函数，但始终传入一个实际的声明方法。 我目前正在尝试获得嵌入式箭头功能以用作中继器。 这是我试图在渲染函数中运行的代码：

    <DropdownButton id='some-id' title={this.state.myId}>
        {Object.keys(this.state.EMPTPS).map(
            k => (
                <Dropdown.Item key={k} eventKey={k}>{this.state.EMPTPS[k]}</Dropdown.Item>
            )
        )}
    </DropdownButton>

因此，我试图遍历在状态声明中创建的对象的一组键，并将这些值用作按钮值，并将这些键用作eventKey和key。 这是我的状态：

    EMPTPS: {
        'KEY1': 'Value1',
        'KEY2': 'Value2',
        'KEY3': 'Value3'
    }

每当运行此代码时，我都会从react收到“元素类型无效”错误，因此显然此处不正确。 我确定（并希望）这只是我自己的一个简单语法错误，但是鉴于我在ES6上仍然还很新鲜，并且反应一般，将不胜感激。

Answer 1

您可以改用使用return语句的语法，有时我去过那里并尝试解决此问题。 我刚刚在箭头后面添加了括号，以将逻辑包裹在迭代中，并在最后返回元素。

 <DropdownButton id='some-id' title={this.state.myId}>
        {Object.keys(this.state.EMPTPS).map( k => {
             return <Dropdown.Item key={k} eventKey={k}>{this.state.EMPTPS[k]}/Dropdown.Item>
            }
        )}
    </DropdownButton>

Answer 2

好吧，这与语法完全无关。 好消息是代码正确。 我的问题在于我的应用程序中具有react-bootstrap和bootstrap的版本。 由于应用程序的大小和性质，我无法更新到v4.x，这对于运行bootstrap-react@1.0.0-beta.5是必需的（Dropdown.Item元素似乎无法在外部运行该版本）据我所知。 无论如何，一个愚蠢的问题与一个愚蠢的解决方案。 感谢所有的建议。