This commit is contained in:
maplemei
2019-10-24 22:26:59 +08:00
parent 20e535ac90
commit db077220d4
13 changed files with 209 additions and 25 deletions

View File

@@ -2,6 +2,13 @@
### 启用分页
```
xmSelect.render({
//...
paging: true,
})
```
:::demo
```html
<div id="demo1" class="xm-select-demo"></div>
@@ -33,6 +40,14 @@ var demo1 = xmSelect.render({
每页3条
```
xmSelect.render({
//...
paging: true,
pageSize: 3,
})
```
:::demo
```html
<div id="demo2" class="xm-select-demo"></div>
@@ -63,6 +78,15 @@ var demo2 = xmSelect.render({
### 搜索+分页
```
xmSelect.render({
//...
paging: true,
pageSize: 5,
filterable: true,
})
```
:::demo
```html
<div id="demo3" class="xm-select-demo"></div>
@@ -108,3 +132,45 @@ document.getElementById('demo3-20').onclick = function(){
</script>
```
:::
### 搜索 + 分页 无数据 不展示分页
```
xmSelect.render({
//...
paging: true,
pageSize: 3,
filterable: true,
pageEmptyShow: false,
})
```
:::demo
```html
<div id="demo4" class="xm-select-demo"></div>
<script>
var demo4 = xmSelect.render({
el: '#demo4',
paging: true,
pageSize: 3,
filterable: true,
pageEmptyShow: false,
data: [
{name: '张三', value: 1},
{name: '李四', value: 2},
{name: '王五', value: 3},
{name: '赵六', value: 4},
{name: '苹果', value: 5},
{name: '香蕉', value: 6},
{name: '凤梨', value: 7},
{name: '葡萄', value: 8},
{name: '樱桃', value: 9},
{name: '车厘子', value: 10},
{name: '火龙果', value: 11},
]
})
</script>
```
:::

View File

@@ -109,3 +109,48 @@ var demo3 = xmSelect.render({
</script>
```
:::
### 全部工具条
```
//全选, 清空, 反选
xmSelect.render({
toolbar: {
show: true,
list: [ 'ALL', 'CLEAR', 'REVERSE' ]
},
})
```
:::demo
```html
<div id="demo4" class="xm-select-demo"></div>
<script>
var demo4 = xmSelect.render({
el: '#demo4',
toolbar: {
show: true,
list: [ 'ALL', 'CLEAR', 'REVERSE' ]
},
filterable: true,
paging: true,
pageSize: 3,
data: [
{name: '张三', value: 1, selected: true},
{name: '李四', value: 2, selected: true},
{name: '王五', value: 3},
{name: '赵六', value: 4},
{name: '苹果', value: 5},
{name: '香蕉', value: 6},
{name: '凤梨', value: 7},
{name: '葡萄', value: 8},
{name: '樱桃', value: 9},
{name: '车厘子', value: 10},
{name: '火龙果', value: 11},
]
})
</script>
```
:::

View File

@@ -12,8 +12,10 @@ var demo1 = xmSelect.render({
el: '#demo1',
autoRow: true,
filterable: true,
create: val => {
console.log(val)
toolbar: {show: true},
paging: true,
create: (val, data) => {
console.log(val, data)
return {
name: val,
value: val,