@beisen-phoenix/group-single-select v3.3.55
分组弹层
注意:该组件即将废弃,我们将不再新增特性。如需使用新特性请替换为该组件:@beisen-phoenix/select-list
API属性如下:
成员 | 说明 | 类型 | 默认值 |
---|---|---|---|
value | 弹层的选中值 | string | - |
size | 分组弹层的尺寸 small(170px) large(340px) auto(与父级自适应) 若与非模态弹层一块使用, 则使用弹层的size属性即可 | string | - |
font | 字体大小 small(12px) large(14px) | Function | - |
loading | 加载状态 | Boolean | false |
options | 选项值 | optionsType | - |
isSearch | 是否显示输入框 | Boolean | false |
searchWord | 搜索的初始值 | string | - |
onChange | 弹层的改变选项时的回调函数 | Function({label, value}) | - |
validateSearch | 自定义搜索验证规则函数 | (searchValue:string) => {value:string,info:value} | |
hasShadow | 是否有阴影 | Boolean | false |
userDefinedComponent | 自定义元素 | -- | -- |
isShowTitle | 是否显示没有选项的分类的标题 | boolean | true |
extraCls | 自定义组件容器class,一般用于覆盖组件默认样式使用 | string | 无 |
autoFocus | 首次挂载时是否自动获取焦点(2019-10-15新增) | boolean | false |
2019-07-12新增api | extraCls | 自定义组件容器class,一般用于覆盖组件默认样式使用| string | 无| No |
代码示例
<GroupSingleSelect
value={value}
singleOptions=[{
label: '增加',
value: 'add'
}]
options=[{
label: "分类一",
children:[{label: "员工1", value: "staff1"}]
}]
font="small"
onChange={this.onChange}
/>
optionsType类型
为了实现一些业务场景,联合显示普通单选和分组单组的情况,且为了不改变数据结构,将普通的单选值放在children中且label为空,即:
const options = [{
children: [{
label: '增加',
value: add
}]
}, {
label: '分类一',
children: [{
label: '员工',
value: 'staff'
}]
}]
validateSearch函数说明
该函数为搜索框的自定义验证函数,一般用来验证搜索内容的长度。通过该函数,你可以自定义验证规则,并且当搜索字符串不满足你的验证规则的时候,你可以改变搜索字符串并在组件中给出你的自定义提示内容
/**
@param val 搜索的字符串
@return {value: '你自定义的字符串',info:'你自定义的提示信息'}
*/
const validateSearch = (val) => {
let res = {value:val,info:''}
if(val.length > 3) {
return {value: val.slice(0,3),info: '搜索字符不能大于3个'}
}
return res
}
多语言
参数 | 说明 | 类型 | 默认值 |
---|---|---|---|
translation | 语言包 用于翻译组件内置常量 | {noData: string} | {noData: '这里什么都没有...'} |
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago