更新记录

1.0.2（2024-04-30）

文档修改

1.0.1（2024-04-30）

修改使用文档

1.0.0（2024-04-25）

初始化组件

平台兼容性

cl-scroll-view

说明

该组件是对uniapp原生scroll-view组件的二次封装，我们平时在使用scroll-view组件的时候，如果想要一个完整的功能需要添加各种属性与方法，所以封装了该组件对部分操作进行简化。

使用方式

<template>
    <view class="content">
        <view class="section_title">
            基本使用
        </view>
        <view style="height: 600rpx;border: 1px solid gainsboro;">
            <cl-scroll-view :apiFun="apiFun" :params="searchParams">
                <template v-slot:list="{list}">
                    <view class="list_box">
                        <view v-for="item in list" :key="item" class="item">{{item}}</view>
                    </view>
                </template>
            </cl-scroll-view>
        </view>
    </view>
</template>
<script setup>
    import {
        reactive,
        ref
    } from 'vue';
    const searchParams = reactive({
        pageSize: 10,
        pageNum: 1
    })
    // 模仿接口
    const apiFun = (params) => {
        return new Promise((resolve, reject) => {
            setTimeout(() => {
                const data = Array.from({
                    length: params.pageSize
                }, (_, i) => (i + 1) + (params.pageNum - 1) * params.pageSize)
                resolve({
                    code: 200,
                    data,
                    message: '查询成功！'
                })
            }, 1000)
        })
    }
</script>

属性列表

插槽

若有问题可联系作者：微信号：fjl_code_life