# 下拉框组件

### 介绍

 下拉框组件；
 选项来源支持数据字典、自定义数据源及数据项；支持下拉树形组件，支持多选等。

### 引入

```js
import { Vue } from 'vue';
import { Select } from '@bingoit/mobile-ui';

Vue.use(Select);
```

## 代码演示

### 基础用法
```html
<bgo-select
    label="测试"
    v-model="testValue"
    required  
    is-search 
    data-source="dict" 
    item="/dict/items/YES_OR_NO" />
```

## API

### Props

| 名称 | 说明 | 类型 | 可选值 | 默认值 |   
| --- | --- | ---- | ----- | ----- |  
| v-model | 当前输入的值 | _number_ / _string_ / _array_ | - |  
| label | 表单的标签文本         | _string_ | - | - |  
| placeholder | 输入框占位文本 | _string_ | - | - |  
| required | 是否显示表单必填星号 | _boolean_ | `true` / `false` | `false` |  
| disabled | 是否禁用           | _boolean_ | `true` / `false` | `false` |  
| readonly | 是否只读           | _boolean_ | `true` / `false` | `false` |  
| hidden   | 是否隐藏           | _boolean_ | `true` / `false` | `false` |  
| async-loading | 是否异步加载；只有isTree属性为true时才生效 | _boolean_ | `true` / `false` | `false` |    
| data-source | 数据源类型      | _string_ | `custom` / `dict` / `url` | - |  
| is-data-convert | 数据源数据是否需要转换 | _boolean_ | `true` / `false` | `true` |  
| item | 数据源对应的数据 | _string_ / _array_ | - | - |
| form-prop-rules | 表单验证规则 | _array_ | - | - |  
| is-tree | 选项是否为树形选择 | _boolean_ | `true` / `false` | `false` |  
| is-select-multiple | 是否支持多选 | _boolean_ | `true` / `false` | `false` |  
| clearable | 是否支持清除选中值 | _boolean_ | `true` / `false` | `false` |  
| is-search | 是否支持搜索 | _boolean_ | `true` / `false` | `false` |


* 注：`data-source`属性为：  
  1. “custom”时，`item`属性值为自定义的选项数组：如：
```json
[{
    "label":"选项1", 
    "value":"option1"
}, {
    "label": "选项2", 
    "value": "option2"
}]
```  
  2. “dict”时，`item`属性值为数据字典对应的URL地址；如: “/dict/item/YES_OR_NO”；   
     
  3. “url”时，`item`属性值为自定义源的URL地址。


### Events

| 事件                 | 说明                 | 回调参数                       |
| ------------------- | ------------------- | ----------------------------- |
| change              | 当绑定值变化时触发的事件 | _value: string_ / _any[]_     |
| clear              | 当绑定值变化时触发的事件 | _event: Event_              |

### 已知问题

当数据为异步加载的树型数据 或者 需要分页加载数据时，因为数据未完全加载的缘故，v-model绑定值的变更可能不会刷新显示。