readme.md 1.4 KB

Waterfall 瀑布流组件

本插件是以“小文章”的为例呈现组件的使用效果,使用者可以根据自身的场景,手动修改项目文件达到自身使用效果。笔者是在开发小程序的过程中,遇到了该需求,并且在插件市场使用了几款瀑布流组件,均不能达到预期目标,所以造了此轮子。

本组件具有以下几个主要优点:

  1. 异步加载图片,提升了响应速度
  2. 小卡片内容自定义度较高,自动响应高度

一、文档结构

┏ uni_modules ┗ wiidz-waterfall ┗ components ┗ wiidz-waterfall ┣ wiidz-demo-card.vue // 卡片 ┗ wiidz-waterfall.vue // 瀑布流主体

二、依赖安装

本插件使用了 tiny-async-pool,请自行安装,也可以改为promise.all的方法,不需要安装依赖。

npm i tiny-async-pool

二、自定义范围

  1. 自定义卡片样式
  2. Waterfall主体的列数、外部边距、行内间距等(具体查看waterfall的props)

三、关于图片下载失败的情况

  1. 预设的图片域名是我自己的oss,和使用者的肯定不契合,可以通过开启不检验域名查看使用效果(真机上记得开启调试)
  2. 改为自己的图片服务器地址后,记得同步配置小程序的download域名

四、其他

有问题可以评论区留言,有空我会查看解答修正的,谢谢!