如何在帶有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元素似乎無法在外部運行該版本）據我所知。 無論如何，一個愚蠢的問題與一個愚蠢的解決方案。 感謝所有的建議。