更新记录

1.0.0(2024-04-07) 下载此版本

首次上传


平台兼容性

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

uc-grid

Grid布局的兼容实现

参数

属性名 属性标题 类型 默认值 可选值
width 宽度(rpx) Number 0
height 高度(rpx) Number 0
space 中间的空白(rpx) Number 0
max 一行的最大数量 Number 0
data 列表 Array []

data

rowOffset: 0
rowSpan: 1
colOffset: 0
colSpan: 1

插槽

cell

i 索引
style 样式
size 尺寸
cell 单元数据

示例

<template>
    <uc-grid :data="data" :widht="200" :height="200" :max="3" :space="25" style="padding: 50rpx 0;margin: 0 50rpx">
        <template #cell="{cell, i, size, style}">   
            <view :style="style">
                {{cell.name}}
            </view>
    </uc-grid>
</template>
<script>
export default {
    data() {
        return {
            data: [
                {name: 'demo1'},
                {name: 'demo2'},
                {name: 'demo3'},
                {name: 'demo4'},
                {name: 'demo5'},
            ]
        }
    }
}
</script>

隐私、权限声明

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

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

插件不采集任何数据

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

许可协议

MIT协议

暂无用户评论。

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