xm-select/docs/mds/XM16.md

监听选择

实时监听

实时监听多选的选中状态变化

:::demo

<div id="demo1" class="xm-select-demo"></div>

<script>
var demo1 = xmSelect.render({
    el: '#demo1', 
    on({ arr, item, selected }){
        alert(`name: ${item.name}, 状态: ${selected}`)
    },
    data: [
        {name: '张三', value: 'zhangsan', selected: true},
        {name: '李四', value: 'lisi', selected: true},
        {name: '王五', value: 'wangwu'},
    ]
})
</script>

:::

监听动态复制

选中北京后, 不能选中上海, 二者互斥

:::demo

<div id="demo2" class="xm-select-demo"></div>

<script>
var demo2 = xmSelect.render({
    el: '#demo2', 
    on({ arr, item, selected }){
        if(selected){
            var index = arr.findIndex(i => i.mutex == item.mutex && i.value != item.value);
            if(index != -1){
                arr.splice(index, 1);
            }
        }
    },
    data: [
        {name: '北京', value: 1, mutex: 1, selected: true},
        {name: '上海', value: 2, mutex: 1},
        {name: '广州', value: 3},
    ]
})
</script>

:::