2019-11-19 20:13:50 +08:00
|
|
|
## 选项显示数量
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
:::tip
|
|
|
|
当数量量过大时, 又不想使用分页的形式, 就可以控制显示数量, 用搜索的方式把最适合的数据展示出来
|
|
|
|
|
|
|
|
!!! 此处与分页配置互斥, 开启分页后, 此配置无效
|
|
|
|
|
|
|
|
!!! 使用此配置时建议开启搜索模式, 否则无法显示全部数据
|
|
|
|
:::
|
|
|
|
|
|
|
|
:::demo
|
|
|
|
```html
|
|
|
|
<div id="demo1" class="xm-select-demo"></div>
|
|
|
|
<div>可以搜索 1, 2, 3看看效果</div>
|
|
|
|
|
|
|
|
<script>
|
|
|
|
var demo1 = xmSelect.render({
|
|
|
|
el: '#demo1',
|
|
|
|
filterable: true,
|
|
|
|
showCount: 5,
|
|
|
|
data: [
|
|
|
|
{name: '张三1', value: 1, selected: true},
|
|
|
|
{name: '李四1', value: 2, selected: true},
|
|
|
|
{name: '王五1', value: 3},
|
|
|
|
{name: '赵六1', value: 4},
|
|
|
|
{name: '苹果2', value: 5},
|
|
|
|
{name: '香蕉2', value: 6},
|
|
|
|
{name: '凤梨2', value: 7},
|
|
|
|
{name: '葡萄2', value: 8},
|
|
|
|
{name: '樱桃3', value: 9},
|
|
|
|
{name: '车厘子3', value: 10},
|
|
|
|
{name: '火龙果3', value: 11},
|
|
|
|
]
|
|
|
|
})
|
|
|
|
</script>
|
|
|
|
```
|
|
|
|
:::
|