重复选
开启重复选
html
<div id="demo1" class="xm-select-demo"></div>
<script>
var demo1 = xmSelect.render({
el: '#demo1',
repeat: true,
data: [
{name: '张三', value: 1},
{name: '李四', value: 2},
{name: '王五', value: 3},
]
})
</script>
重复选完关闭下拉
html
<div id="demo2" class="xm-select-demo"></div>
<script>
var demo2 = xmSelect.render({
el: '#demo2',
repeat: true,
clickClose: true,
data: [
{name: '张三', value: 1},
{name: '李四', value: 2},
{name: '王五', value: 3},
]
})
</script>
更换显示方式
好像这样只能增不能减了~~ 有待完善
html
<div id="demo3" class="xm-select-demo"></div>
<script>
var demo3 = xmSelect.render({
el: '#demo3',
repeat: true,
model: {
label: {
type: 'count',
count: {
template: function(data, sels){
var res = {};
sels.forEach(item => {
var name = item.name;
!res[name] && (res[name] = 0);
res[name] += 1;
});
return Object.keys(res).map(key => {
return `${key} (${res[key]})`
}).join(',');
}
},
}
},
data: [
{name: '张三', value: 1},
{name: '李四', value: 2},
{name: '王五', value: 3},
]
})
</script>