更新记录
1.1.0(2024-10-31) 下载此版本
1、基本功能实现:实现了一个基本的左对齐网格布局组件,能够根据传入的数据数组生成相应的网格项,并自动换行。 2、属性配置:增加了items和itemsPerRow两个属性,分别用于传入数据数组和配置每行显示的元素数量 3、插槽支持:增加了对插槽的支持,允许用户自定义每个网格项的内容。通过使用插槽,用户可以在父组件中定义每个网格项的模板,从而提供更大的灵活性和可定制性。 4、样式优化:优化了组件的CSS样式,确保所有子元素左对齐,并且自动换行。通过设置gap属性来调整元素之间的间距,使布局更加美观和一致。 5、动态列数:通过计算属性gridTemplateColumns动态设置每行的列数,使得组件更加灵活,可以根据传入的itemsPerRow属性值来配置每行显示的元素数量。
平台兼容性
uni-app
| Vue2 | Vue3 | Chrome | Safari | app-vue | app-nvue | Android | iOS | 鸿蒙 |
|---|---|---|---|---|---|---|---|---|
| √ | × | - | - | × | × | - | - | - |
| 微信小程序 | 支付宝小程序 | 抖音小程序 | 百度小程序 | 快手小程序 | 京东小程序 | 鸿蒙元服务 | QQ小程序 | 飞书小程序 | 快应用-华为 | 快应用-联盟 |
|---|---|---|---|---|---|---|---|---|---|---|
| - | - | - | - | - | - | - | - | - | - | - |
1、组件引入使用 import GridLeft from "@/components/gird-left/gird-left.vue" 2、页面使用
3、数据 data(){ return{ items: ['1','2','3','4'], } }

收藏人数:
下载插件并导入HBuilderX
赞赏(0)
下载 1
赞赏 0
下载 10654508
赞赏 1794
赞赏
京公网安备:11010802035340号