更新记录

1.2.0(2024-07-20) 下载此版本

1.修复vue2中web端页面初始化不加载情况;

2.实现方法:异步初始化数据页面渲染加载 // 1. 方式一 / this.$nextTick(()=>{ }) / // 2.方式二 / setTimeout(()=>{ },20) /


平台兼容性

Vue2 Vue3
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
HBuilderX 3.8.0
钉钉小程序 快手小程序 飞书小程序 京东小程序
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari

BinBin-waterfallFlowFolder

1.一个闲着无聊的前端开发人员小彬,给大家分享点实用干货。有兴趣欢迎点赞收藏。

2.有疑问联系QQ173-2755-058哦。

3.插件如果有帮助到你的,请给me一个小小的收藏,谢谢大家支持。

4.遇到bug欢迎大家在下面留言或私信我,我会积极更新优化出更好的产品给大家。

5.项目实例请查看 @components/BinBin-waterfallFlowFolder/flowIndex.vue

以下是插件使用方法:

<template>
    <view class="container">
        <waterfallFlowVue :imgList="colums" @fastpayId="fastpayId"></waterfallFlowVue>
    </view>
</template>
<script>
    import waterfallFlowVue from '@/components/BinBin-waterfallFlowFolder/BinBin-waterfallFlowFolder.vue'
    export default {
        components: {
            waterfallFlowVue
        },
        data() {
            return {
                colums: [{
                        id: 1,
                        picture: 'https://img2.baidu.com/it/u=1226876983,4055472391&fm=253&app=138&f=JPEG?w=800&h=1067',
                        name: '李宁1',
                        sale: '500',
                        saleType: 1,
                        promotionPrice: '433',
                        price: '566',
                        companyName: '好再来官方旗舰店'
                    },
                    {
                        id: 2,
                        picture: 'https://img1.baidu.com/it/u=1571288117,3717156997&fm=253&app=138&f=JPEG?w=500&h=707',
                        name: '李宁2',
                        sale: '500',
                        saleType: 1,
                        promotionPrice: '433',
                        price: '566',
                        companyName: '好再来官方旗舰店'
                    },
                    {
                        id: 3,
                        picture: 'https://t14.baidu.com/it/u=207829538,394884992&fm=224&app=112&f=JPEG?w=500&h=500',
                        name: '李宁3',
                        sale: '500',
                        saleType: 1,
                        promotionPrice: '433',
                        price: '566',
                        companyName: '好再来官方旗舰店'
                    },
                    {
                        id: 4,
                        picture: 'https://img2.baidu.com/it/u=866739636,2433403903&fm=253&app=138&f=JPEG?w=500&h=707',
                        name: '李宁4',
                        sale: '500',
                        saleType: 1,
                        promotionPrice: '433',
                        price: '566',
                        companyName: '好再来官方旗舰店'
                    },
                    {
                        id: 5,
                        picture: 'https://t13.baidu.com/it/u=3232122932,1277494141&fm=224&app=112&f=JPEG?w=375&h=500',
                        name: '李宁5',
                        sale: '500',
                        saleType: 1,
                        promotionPrice: '433',
                        price: '566',
                        companyName: '好再来官方旗舰店'
                    },
                    {
                        id: 6,
                        picture: 'https://t14.baidu.com/it/u=106128379,1359791379&fm=224&app=112&f=JPEG?w=500&h=500',
                        name: '李宁6',
                        sale: '500',
                        saleType: 1,
                        promotionPrice: '433',
                        price: '566',
                        companyName: '好再来官方旗舰店'
                    },
                    {
                        id: 7,
                        picture: 'https://cos2.solepic.com/20191014/b_1647050201910141116069461.jpg',
                        name: '李宁7',
                        sale: '500',
                        saleType: 1,
                        promotionPrice: '433',
                        price: '566',
                        companyName: '好再来官方旗舰店'
                    },
                    {
                        id: 8,
                        picture: 'https://img2.baidu.com/it/u=430344235,4171760739&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500',
                        name: '李宁8',
                        sale: '500',
                        saleType: 1,
                        promotionPrice: '433',
                        price: '566',
                        companyName: '好再来官方旗舰店'
                    },
                    {
                        id: 9,
                        picture: 'https://pic.quanjing.com/87/7c/QJ8121463169.jpg@!350h',
                        name: '李宁9',
                        sale: '500',
                        saleType: 1,
                        promotionPrice: '433',
                        price: '566',
                        companyName: '好再来官方旗舰店'
                    },
                    {
                        id: 10,
                        picture: 'https://img2.baidu.com/it/u=1207371359,909867081&fm=253&fmt=auto&app=120&f=JPEG?w=500&h=500',
                        name: '李宁10',
                        sale: '500',
                        saleType: 1,
                        promotionPrice: '433',
                        price: '566',
                        companyName: '好再来官方旗舰店'
                    },
                    {
                        id: 11,
                        picture: 'https://t13.baidu.com/it/u=926794518,3634761433&fm=224&app=112&f=JPEG?w=500&h=500',
                        name: '李宁11',
                        sale: '500',
                        saleType: 1,
                        promotionPrice: '433',
                        price: '566',
                        companyName: '好再来官方旗舰店'
                    },
                    {
                        id: 12,
                        picture: 'https://img6.hznzcn.com/goods/crawler/20220405/20220405124000637633360.jpg',
                        name: '定制t恤印字logo照片短袖同学聚会班服工作衣服定做广告文化衫di',
                        sale: '500',
                        saleType: 1,
                        promotionPrice: '433',
                        price: '566',
                        companyName: '好再来官方旗舰店'
                    },
                ]
            }
        },
        methods: {
        fastpayId(id) {
        console.log(id, );
        }
    }
}

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

插件不采集任何数据

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

下载展示刚刚浏览

许可协议

MIT协议

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问