我很难弄清楚如何设置一个动态下拉组件，对我正在处理的功能中的每个渲染元素进行多值选择。我想我真的很接近了，但最终需要一点指导。

以下是组件：

import React, { Component } from 'react'
import { List, Dropdown, Label } from 'semantic-ui-react'

const directions = [
    {key: "0.0", text: "0.0", value: "0.0"},
    {key: "22.5", text: "22.5", value: "22.5"},
    {key: "45.0", text: "45.0", value: "45.0"},
    {key: "67.5", text: "67.5", value: "67.5"},
    {key: "90.0", text: "90.0", value: "90.0"}
]

const channels = [
    {ch: 65, callsign: "TEST1"},
    {ch: 49, callsign: "TEST2"},
    {ch: 29, callsign: "TEST3"}
]

export default class DirectionalSelection extends Component {
    constructor(props) {
        super(props)

        this.state = {
            channels,
            directions,
            currentValues: {}
        }
    }

    handleDropdownChange = (e, index, { value }) => {
        this.setState(({ currentValues }) => {
            currentValues[index] = value
            return currentValues
        })
    }

    handleDirAddition = (e, index, { value }) => {
        this.setState(({ directions }) => {
            directions[index] = [{ text: value, value }, ...this.state.directions]
            return directions
        })
    }

    render() {
        const { channels, currentValues, directions } = this.state
        return (
            <div>
                <List>
                    {channels.map((el, index) => (
                        <List.Item key={index}>
                            <Label>{el.ch}</Label>
                            <Dropdown
                                search
                                multiple
                                selection
                                scrolling
                                allowAdditions
                                options={directions}
                                value={currentValues[index]}
                                placeholder='Choose directions'
                                onAddItem={this.handleDirAddition.bind(this, index)}
                                onChange={this.handleDropdownChange.bind(this, index)}
                            />
                        </List.Item>
                    ))}
                </List>
            </div>
        )
    }
}

现在，每当我在任何频道上选择下拉值时，currentValues返回为[object object]：[“22.5”、“45.0”]。我想将频道中的ch键设置为键，将下拉值数组设置为值，并将它们附加到当前值中。

我希望我已经澄清了这个问题，能够理解。下面是指向语义UI React文档的链接，其中包含我正在使用的原始组件：https://react.semantic-ui.com/modules/dropdown#dropdown-示例：允许多个添加。谢谢你的帮助！