更新记录
1.0.1(2025-04-03) 下载此版本
修复部分CSS样式出现错位情况
1.0(2025-04-03) 下载此版本
新版本发布
平台兼容性
uni-app
| Vue2 | Vue3 | Chrome | Safari | app-vue | app-nvue | Android | iOS | 鸿蒙 |
|---|---|---|---|---|---|---|---|---|
| √ | - | - | - | - | - | - | - | - |
| 微信小程序 | 支付宝小程序 | 抖音小程序 | 百度小程序 | 快手小程序 | 京东小程序 | 鸿蒙元服务 | QQ小程序 | 飞书小程序 | 快应用-华为 | 快应用-联盟 |
|---|---|---|---|---|---|---|---|---|---|---|
| - | - | - | - | - | - | - | - | - | - | - |
👉 插件使用说明
本插件开发语言为: Vue3、Vue2 开发(未使用CSS预处理,开箱即用),插件内CSS样式默认采用 "rpx" 格式, 如果不懂的可以去查阅教程。不修改不影响使用!
| 组件语法版本指引 | |
|---|---|
| Vue3 | 当前文档 |
| Vue2 | 点我跳转 |
👉 使用方法
Vue3版本使用示例代码:
<!-- template 页面 -->
<JhImageList radius :column="4" :list="list"></JhImageList>
<!-- script setup -->
import JhImageList from '@/components/jh-image-list/jh-image-list.vue'
let list = reactive([{
url: "https://ts1.tc.mm.bing.net/th/id/OIP-C.OSFH3hIukHqh-qrOvIfUWgAAAA?w=224&h=278&c=8&rs=1&qlt=90&o=6&pid=3.1&rm=2"
})
Arrt 参数
| 参数 | 类型 | 必填 | 默认值 | 说明 |
|---|---|---|---|---|
| webp | Boolean | 否 | false | 图片webp支持 |
| draggable | Boolean | 否 | false | 图片是否可拖动 |
| lazyLoad | Boolean | 否 | false | 图片是否懒加载 |
| radius | Boolean | 否 | false | 图片是否圆角 |
| column | Number | 是 | 2 | 每列数量 |
| list | Array | 是 | [] | 列表 |
Events 事件
| 事件名称 | 说明 |
|---|---|
| click | 当点击单元格时(与tap事件选一,按需求选择其中一个点击事件) |
| tap | 当点击单元格时(与click事件选一,按需求选择其中一个点击事件) |
☕ 赏一口饭给作者 ☕
🧏♂️ Call Me 联系作者 🧏♂️
如果有重大BUG可以紧急联系我,如果小问题请直接评论即可,按照问题热度选择性更新

收藏人数:
下载插件并导入HBuilderX
下载示例项目ZIP
赞赏(0)
下载 76
赞赏 0
下载 11204404
赞赏 1805
赞赏
京公网安备:11010802035340号