1.0.2 • Published 2 years ago
@mas.io/adc-painter v1.0.2
安装
tnpm install --save @alipay/adc-painter
组件介绍
行业小程序生成海报组件,针对支付宝行业的各个不同场景进行定制化开发,满足业务需求。
参数说明
属性 | 必填 | 参数类型 | 参数说明 | 默认值 | 示例 | |
---|---|---|---|---|---|---|
customStyle | 否 | Object | 自定义样式 | null | null | |
palette | 是 | Object | 数据源 | {} | { "width": "100px", "views": {"type": "text", "text": "张三", "css": {"color": "#fff"}}} | |
views | 否 | Array | palette内部属性 | [] | {"type": "text", "text": "张三", "css": {"color": "#fff"}} | |
type | 否 | String | views内部属性, text: 文本, qrcode: 二维码, image: 图片 | "" | text | |
text | 否 | String | views内部属性, 当type为text时生效 | 渲染的文本内容 | "" | 张三 |
content | 否 | String | views内部属性, 当type为qrcode时生效 | 二维码的内容 | "" | 张三 |
image | 否 | String | views内部属性, 当type为image时生效 | 图片url地址 | "" | 'http://xxxxxx' |
css | 否 | Object | views内部属性 | {} | {"color": "#fff", fontSize: "12px"} | |
onSuccess | 否 | Function | 海报生成成功时返回 | null | () => {} | |
onError | 否 | Function | 海报生成失败时返回 | null | () => {} |
在小程序中使用
{
"usingComponents": {
"mas-adc-painter": "@alipay/adc-painter/es/index"
}
}
在 page.axml 中引用组件
<!-- 页面使用方式 -->
<mas-adc-painter
palette="{{ palette }}"
onSuccess="onSuccess"
onError="onError"
/>