更新记录

1.0.2（2023-06-12） 下载此版本

增加预览二维码

1.0.1（2023-05-16） 下载此版本

增加示例

V1.0.3（2023-04-14） 下载此版本

增加示例

平台兼容性

uni-app

liu-notice-bar适用于uni-app项目的NoticeBar通告栏向上、向左滚动组件

本组件目前兼容微信小程序、H5

本组件支持单条、多条数据向上、向左滚动、点击等

--- 扫码预览、关注我们 ---

扫码关注公众号，查看更多插件信息，预览插件效果！

使用示例

<template>
    <view>
        <view style="margin: 20rpx;font-size: 30rpx;">示例一：向上循环滚动</view>
        <view style="background-color: #F70707;padding: 0 20rpx;">
            <liu-notice-bar :dataList="noticeList" color="#FFFFFF" :interval="2000" @click="click"></liu-notice-bar>
        </view>
        <view style="margin: 20rpx;font-size: 30rpx;">示例二：横向循环滚动</view>
        <view style="background-color: #F70707;padding: 0 20rpx;">
            <liu-notice-bar :dataList="noticeList" :type="2" color="#FFFFFF" :interval="2000"
                @click="click"></liu-notice-bar>
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                noticeList: [{
                        id: '1',
                        titile: '这里是第1条通知公告的内容'
                    },
                    {
                        id: '2',
                        titile: '这里是第2条通知公告的内容'
                    }
                ]
            }
        },
        methods: {
            //点击通知
            clickNotice(e) {
                console.log('所点击的信息：', e)
            }
        }
    }
</script>

属性说明