reactjs - 根据数组中元素的数量生成下拉列表

Question

假设我有一个数组：

const nameArray = ["apple","banana","orange"]

我尝试根据数组中的元素数量生成下拉菜单，为此我尝试如下：

    <FormControl className={classes.formControl}>
        <InputLabel id="Select Vendors" >Select Vendors</InputLabel>
        <Select name="vendors" id="vendors">
        {nameArray.forEach(element => {
            <MenuItem value={element}>element</MenuItem>        
        })}
        </Select>
    </FormControl> 

但它给了我错误：期望一个赋值或函数调用，而是看到一个表达式

还有什么可以根据元素生成下拉菜单？

标签： reactjsreact-hooksmaterial-ui

Answer 1

const nameArray = ["apple","banana","orange"];

<FormControl className={classes.formControl}>
    <InputLabel id="Select Vendors" >Select Vendors</InputLabel>
    <Select name="vendors" id="vendors">
    {nameArray.map(element => {
        return <MenuItem value={element}>element</MenuItem>;   
    })}
    </Select>
</FormControl>