# 标签选择器

## 批量标签选择器

### 效果图
![](https://im.weaver.com.cn/server/index.php?s=/api/attachment/visitFile&sign=0c32f96a5f32e6b99a7d8efc2075c774)

### DEMO

CorsComponent 组件方式

```js

render() {
    return <>
            <Button type='primary' onClick={this.toggleTagSelector}>打开标签选择器</Button>
            <CorsComponent
                app='@weapp/my'
                compName='MTagSelector'
                module='task'
                entityIds={['2224344145765762818','2224207315225000376']}
                visible={this.state.openTagSelector}
                onClose={this.toggleTagSelector}
                onSelect={this.onSelect}
            />
    </>
}

toggleTagSelector = () => {
    this.setState({ openTagSelector: !this.state.openTagSelector })
}

onSelect = (tags: any[]) => {
    console.log('on select', tags)
}
```

### 参数说明

| 参数      | 说明                                            | 类型                      | 是否必填 | 默认值 |
|:----------|:------------------------------------------------|:--------------------------|:---------|:-------|
| module    | 事项所属模块                                    | string                    | 是       | -      |
| entityIds | 事项 id 列表，支持多个事项的批量设置            | string[]                  | 是       | -      |
| visible   | 是否显示                                        | boolean                   | 是       | -      |
| action    | 操作类型，是设置标签还是移除标签(add / remove) | enum                        | 否     | add    |
| onClose   | 关闭时的回调                                    | () => void                | 是       | -      |
| onSelect  | 选中标签的回调方法，返回设置的标签              | (tags: TagData[]) => void | 否       | -      |
| onFail    | 设置事项标签失败时的回调                        | ()=> void                 | 否       | -      |
| onUpdate  | 标签数据变化（新增、修改、删除）时的回调        | (UpdateResult)=> void     | 否       | -      |

## 事项标签选择器（包含界面）

### 效果图
![](https://im.weaver.com.cn/server/index.php?s=/api/attachment/visitFile&sign=deb56ab260e0fc69a83ba948f18ad791)

### DEMO

CorsComponent 组件方式

```js

render() {
    return <>
            <Button weId={`${this.props.weId || ''}_vgf33o`} type='primary' onClick={this.toggleTagSelector}>打开标签选择器</Button>
            <CorsComponent
                weId={`${this.props.weId || ''}_lsqq0w`}
                app='@weapp/my'
                compName='MEntityTagSelector'
                module='task'
                entityIds={['2224344145765762818']}
            />
    </>
}
```

### 参数说明

| 参数      | 说明                                            | 类型     | 是否必填 | 默认值 |
|:----------|:------------------------------------------------|:---------|:---------|:-------|
| module    | 事项所属模块                                    | string   | 是       | -      |
| entityIds | 事项 id 列表                                    | string[] | 是       | -      |
| action    | 操作类型，是设置标签还是移除标签(add / remove) | 否       | enum     | add    |
