更新记录

1.0.1（2020-03-02） 下载此版本

首次提交

平台兼容性

关于

列表多选插件

数据结构（普通tree）

dataList: [{
                        id: "1",
                        select: false
                    },
                    {
                        id: "2",
                        select: false
                    },
                    {
                        id: "3",
                        select: false
                    },
                ]

使用

html

<template>
    <view>
        <me-select 
        ref="meSelect" 
        @change="change" 
        @finish="finish" 
        @itemClick="itemClick" 
        :datalist="dataList"
        :options="options"
        >
            <view slot-scope="slot" class="item">
               <!-- 这里可以写自己的模板 -->
                <view>{{slot.slotScope.item.id}}</view>
            </view>
        </me-select>
        <button @click="changeModel">编辑/取消</button>
        <button @click="getSelectAll">获取所有选中的列表</button>
    </view>
</template>
<style>
    .item {
        border: 1px solid red;
    }
</style>

js

<script>
    import meSelect from '@/components/me-select/me-select.vue'
    export default {
        components: {
            meSelect
        },
        data() {
            return {
                options: {
                    flags: ['id'], //设置需要返回的参数这个参数必须在 dataList 中的item中存在（不配置默认全部返回）
                    itemCanSelect: true //是否开启点击列表页选择配置
                },
                dataList: [{
                        id: "1",
                        select: false
                    },
                    {
                        id: "2",
                        select: false
                    },
                    {
                        id: "3",
                        select: false
                    },
                ]
            }
        },

        methods: {
            changeModel() {
                this.$refs.meSelect.changeModel()
            },
            getSelectAll() {
                var result = this.$refs.meSelect.getSelectAll()
                console.log('当前全选：', result)
            },
            itemClick(e) {
                console.log('列表点击了：', e)
            },
            finish(e) {
                console.log('所有的选择：', e)
            },
            change(e) {
                console.log('发生改变了：', e)
            }
        }
    }
</script>