更新记录
1.0.0(2024-05-23)
初始化
平台兼容性
Vue2 | Vue3 |
---|---|
√ | √ |
App | 快应用 | 微信小程序 | 支付宝小程序 | 百度小程序 | 字节小程序 | QQ小程序 |
---|---|---|---|---|---|---|
HBuilderX 3.1.0 | × | √ | √ | × | × | × |
钉钉小程序 | 快手小程序 | 飞书小程序 | 京东小程序 |
---|---|---|---|
× | × | × | × |
H5-Safari | Android Browser | 微信浏览器(Android) | QQ浏览器(Android) | Chrome | IE | Edge | Firefox | PC-Safari |
---|---|---|---|---|---|---|---|---|
× | × | × | × | × | × | × | × | × |
jiangcs-card-list
卡片列表
props定义
data-arr
数据数组
{
id: 1,
title: '测试',
logo: '',
contentArr: [{
label: '类型',
value: '鸡'
}, {
label: '棚舍数量',
value: '80',
unit: '间'
}, {
label: '规模',
value: '20000',
unit: '只'
},{
label: '联系人',
value: '张三丰'
}, {
label: '联系方式',
value: ''
}],
remark: '卿山清水倾天下'
}
gap
数据分割
数组按gap进行分组,换行显示
slot 定义
title-prefix
标题前缀插槽
<template #title-prefix="{item}">@</template>
extra
右上角插槽
<template #extra="{item}">修改</template>
remark-prefix
备注前缀插槽
<template #remark-prefix="{item}">%</template>
footer
底部插槽
<template #footer="{item}"><button>进入</button></template>