Javascript React：渲染状态数组

我正在使用React制作一个搜索表单，其中包括一个多选择标记，该标记将所选选项作为数组添加到状态中

如何成功地将所选项目作为可移动按钮呈现到box div中

class Search extends React.Component {
    constructor(props) {
        super(props)
        this.state = { selected: [] }
        this.handleChange = this.handleChange.bind(this)
    }

    handleChange = e => {
        let item = e.target.value
        let selected = this.state.selected
        if (selected.includes(item)) {
            return null
        } else {
            selected.push({ item })
            this.setState({ selected: item })
        }
    }

    render() {
       const items = [ item1, item2, item3,... ]

    return(
       .....
       <select
           multiple={true}
           value={this.state.value}
           onChange={this.handleChange}>
           {items.map(item => (
              <option
                 key={item}
                 value={item}>
                 {item}
             </option>
           ))}
      </select>
      <div className="box">
      </div>

类搜索扩展了React.Component{
建造师（道具）{
超级（道具）
this.state={selected:[]}
this.handleChange=this.handleChange.bind（this）
}
handleChange=e=>{
让项目=e.target.value
让选定项=this.state.selected
如果（选中。包括（项目））{
返回空
}否则{
已选择。推送（{item}）
this.setState（{selected:item}）
}
}
render（）{
常量项=[item1、item2、item3，…]
返回(
.....
{items.map（item=>(
{item}
))}

您可以使用与选择

相同的方法

例如：

<div className="box">
   { 
     this.state.selected.map(item => (
        <Button ...>
     ))
   }
</div>


{ 
this.state.selected.map（项=>(
))
}
这样做

selected.push({ item })

实际上，您正在将对象推送到数组，这应该是

selected.push( item )  //push item directly

而且您的状态设置不正确

this.setState({ selected: item })

你应该只有

this.setState({ selected })

最后你可以像这样迭代选定的数组

<div className="box">
  { this.state.selected && this.state.selected.length > 0 && this.state.selected.map(selected=> <button key={selected}>{selected}</button>)
  }
</div>


{this.state.selected&&this.state.selected.length>0&&this.state.selected.map（selected=>{selected}）
}

将项目设为对象
当item select-toggle isSelected为true时，如果item object.isSelected===true，请点击一些按钮
我已经尝试过了，但它说this.state.selected.map不是函数。天哪，我犯了一个愚蠢的错误。facepalm谢谢，这成功了！嗨，twisturb，请阅读此-，然后尝试结束问题。
const items = [ {item1:item1, isSelected: false}, {item2, isSelected: false},... ]