如何从 API 响应动态填充选择框

Question

我正在尝试从 api 响应中动态创建选择框。 下面是 api 响应

{
    "land": [{
        "land_id": 15,
        "name": "zipku",
        "description": "zipku"
    }, {
        "land_id": 16,
        "name": "jumba",
        "description": "jumba"
    }],
    "type": [{
        "type_id": 1,
        "name": "s_id",
        "description": "s_id"
    }, {
        "type_id": 2,
        "name": "s_id2",
        "description": "s_id2"
    }],
    "nationality": [{
        "id": 1,
        "name": "Japan",
        "description": "Japan"
    }, {
        "id": 2,
        "name": "Hong_Kong",
        "description": "Hong_Kong"
    }]
}

我正在使用与蚂蚁设计的反应。 到目前为止我做了什么

                        Object.keys(myObject).map((idx, i) => {
                            return (<Select key={i}
                                {...myObject[idx].map((selec, i) => (
                                    <Option value={selec.name}>{selec.name}}</Option>
                                ))}

                            >

                            </Select>)
                        })

有人可以解释一下我做错了什么吗？

Answer 1

试试这个

  Object.keys(myObject).map((idx, i) => {
                        return (<Select key={i}>
                           {myObject[idx].map((selec, i) => (
                                <Option value={selec.name}>{selec.name}</Option>
                            ))}
                        </Select>)
                    })