更新记录

1.0.2（2023-12-11）

优化使用方法，使用更加方便简洁；添加自定义滚动高度，每行滚动高度，最少滚动条数；添加默认样式，支持自定义默认样式字段；优化代码质量；谢谢大家的支持，有任何问题或者有新的需求，可联系ZhangHaoqwezxc，我都尽量去解决问题！

1.0.1（2023-12-11）

优化使用方法，使用更加方便简洁；添加自定义滚动高度，每行滚动高度，最少滚动条数；添加默认样式，支持自定义默认样式字段；优化代码质量；谢谢大家的支持，有任何问题或者有新的需求，可联系ZhangHaoqwezxc，我都尽量去解决问题！

1.0.0（2022-11-07）

支持 小程序、h5、app，请各路大神多多指教！！！

平台兼容性

使用说明

注册组件后直接使用，支持自定义内容。

使用方式

import scrollList from '@/components/zh-scrollList/scrollList/scrollList'

在页面中使用组件

import scrollList from '@/components/zh-scrollList/scrollList/scrollList'

<scrollList :list="goods_list">
    <template #default="{rows}">
        <view class="rows">
            <view>自定义内容</view>
        </view>
    </template>
</scrollList>

参数说明

示例

<template>
    <view class="">
        <view class="content">
            <view class="title">循环滚动列表，支持小程序、h5、app</view>
            <view class="titlea">支持slot自定义内容</view>
            <view class="scroll_list">
                <scrollList :list="goods_list">
                    <template #default="{rows}">
                        <view class="rows">
                            <view class="">{{rows.name}}</view>
                            <view class="">{{rows.time}}</view>
                        </view>
                    </template>
                </scrollList>
            </view>
        </view>
    </view>
</template>

<script>
    import scrollList from '@/components/zh-scrollList/scrollList/scrollList'
    export default {
        components: {
            scrollList
        },
        data() {
            return {
                goods_list: [{
                        id: 1,
                        name: '用户1',
                        time: '54分钟前'
                    },
                    {
                        id: 2,
                        name: '用户2',
                        time: '54分钟前'
                    }, {
                        id: 3,
                        name: '用户3',
                        time: '54分钟前'
                    }, {
                        id: 4,
                        name: '用户4',
                        time: '54分钟前'
                    }, {
                        id: 5,
                        name: '用户5',
                        time: '54分钟前'
                    }, {
                        id: 6,
                        name: '用户6',
                        time: '54分钟前'
                    }, {
                        id: 7,
                        name: '用户7',
                        time: '54分钟前'
                    }, {
                        id: 8,
                        name: '用户8',
                        time: '54分钟前'
                    }, {
                        id: 9,
                        name: '用户9',
                        time: '54分钟前'
                    }, {
                        id: 10,
                        name: '用户10',
                        time: '54分钟前'
                    },
                ]
            }
        },
        onLoad() {

        },
        methods: {

        },
        computed: {

        },
        watch: {

        }
    }
</script>

<style lang="scss" scoped>
    .content {
        padding: 24upx;

        .title {
            text-align: center;
            margin-bottom: 10upx;
            font-size: 30upx;
            color: #333;
            font-weight: bold;
        }

        .titlea {
            text-align: center;
            margin-bottom: 20upx;
            font-size: 26upx;
            color: #333;
            font-weight: bold;
        }

        .scroll_list {
            padding: 0 24upx;

            .rows {
                display: flex;
                align-items: center;
                justify-content: space-between;
            }
        }
    }
</style>