更新记录

1.0.1（2023-03-22）

修改多选赋值问题，引入uni-icons

1.0.0（2023-03-20）

初始版本

平台兼容性

Select组件

配置参数

事件

组件使用

<template>
    <view class="content">
        单选：{{select1}}
        <qy-select v-model="select1" :options="data"></qy-select>
        单选：{{select2}}
        <qy-select v-model="select2" :options="data" filterable></qy-select>
        单选分页：{{select3}}
        <qy-select v-model="select3" :options="data" :remoteMethod="remoteMethod" filterable remote></qy-select>
        多选：{{muiSelect}}
        <qy-select v-model="muiSelect" :options="data" multiple></qy-select>
        <view class="bottom">
            底部：{{select4}}
            <qy-select v-model="select4" :options="data"></qy-select>
        </view>
    </view>
</template>

<script>
import QySelect from '../../components/qiyan-select/qiyan-select'
export default {
    components: {
        QySelect
    },
    data() {
        return {
            select1: '',
            select2: '',
            select3: '',
            select4: '',
            muiSelect: [],
            data: []
        }
    },
    onLoad() {
        uni.showLoading({
            title: '加载中'
        });
        setTimeout(() => {
            for (let i = 1; i <= 10; i++) {
                this.data.push({
                    label: "选项" + i,
                    value: i
                });
            }
            uni.hideLoading();
        }, 3000)
    },
    methods: {
        remoteMethod(params) {
            let page = params.page;
            console.log(page);
            return new Promise(resolve => {
                for (let i = (page - 1) * 10 + 1; i <= page * 10; i++) {
                    this.data.push({
                        label: "选项" + i,
                        value: i
                    });
                }
                resolve({ success:true, noMore:false });
            })
        }
    }
}
</script>

<style scoped>
.content {
    padding: 0 10px;
}

.bottom {
    position: fixed;
    bottom: 100px;
    width: calc(100% - 20px);
    /* padding: 0 10px; */
}
</style>

说明

此插件依赖uni-scss\uni-icons\uni-load-more，请务必安装！！！