## 选择器组件

## 代码演示

```tsx
import React, {useState} from 'react'
import {Selector} from 'ui-component-5e'

const ESelector: React.FC = () => {
  const selectArr = [
    {
      key: 1,
      label: '第一',
    },
    {
      key: 2,
      label: '第二',
    },
    {
      key: 3,
      label: '第三',
    },
  ]
  const [selectKey, setSelectKey] = useState([])
  const [selectMultiKey, setSelectMultiKey] = useState([])
  const onSelect = (selected: boolean, value: number) => {
    setSelectKey([value])
  }
  const onMultiSelect = (selected: boolean, value: number) => {
    setSelectMultiKey(preState =>
      selected ? preState.concat(value) : preState.filter(id => id !== value)
    )
  }
  return (
    <div className="stories-box">
      单选
      {selectArr.map(item => (
        <Selector
          key={item.key}
          onSelect={onSelect}
          selected={selectKey.includes(item.key)}
          value={item.key}>
          <div>{item.label}</div>
        </Selector>
      ))}
      <br />
      多选
      {selectArr.map(item => (
        <Selector
          key={item.key}
          multi
          onSelect={onMultiSelect}
          selected={selectMultiKey.includes(item.key)}
          value={item.key}>
          <div>{item.label}</div>
        </Selector>
      ))}
    </div>
  )
}
export default () => <ESelector />;
```
***
## API 
Select props

|   参数   |  说明   |  类型    |  默认值  |
|  ----   |  ----   |  ----   |  ----   |
|  data  |  treeNodes 数据(value 在整个树范围内唯一)  |  array<{value, title, children,departInfoList}>  |  \-  |
|  multi  |  支持点选多个节点  |  boolean  |  false  |
|  selected  |  选中的树节点数组  |  number[ ]  |  [ ]  |
|  onSelect  |  点击选中的回调  |  function  |  \-  |
|  levelPadding  |  层级节点外边距  |  number  |  24  |
  
***
  
## FAQ
##### 为什么有时选中一个选项会勾选两个选项？ 

因为选项的key相同