更新记录
1.0.0(2025-07-17) 下载此版本
创建基础示例 leafer-ui官网:https://www.leaferjs.com
平台兼容性
uni-app(4.06)
Vue2 | Vue3 | Chrome | Safari | app-vue | app-nvue | Android | iOS | 鸿蒙 |
---|---|---|---|---|---|---|---|---|
√ | √ | √ | √ | √ | - | √ | √ | √ |
微信小程序 | 支付宝小程序 | 抖音小程序 | 百度小程序 | 快手小程序 | 京东小程序 | 鸿蒙元服务 | QQ小程序 | 飞书小程序 | 快应用-华为 | 快应用-联盟 |
---|---|---|---|---|---|---|---|---|---|---|
- | - | - | - | - | - | - | - | - | - | - |
wzq-leafer-ui
示例
<wzq-leafer-ui ref='leafer' style="width: 100%;height: 50vh;" @RectStartCb="rectStartCb" @RectEndCb="rectEndCb" @syncExport="syncExport"></wzq-leafer-ui>
<button @click="addUi">add</button>
<button @click="exportPng">导出</button>
syncExport(e){
console.log('syncExport',e);
},
exportPng(){
this.$refs.leafer.callMethod('syncExport',['png',{
quality: 1.0
}])
},
rectStartCb(e){
console.log('start',e);
},
rectEndCb(e){
console.log('end',e);
},
addUi(){
this.$refs.leafer.addUI('Rect',{
width: 100,
height: 100,
fill: '#32cd79',
cornerRadius: [0, 40, 20, 40],
draggable: true
},[{
leaferEventName:'drag.start',
uiEventName:'RectStartCb'
},
{
leaferEventName:'drag.end',
uiEventName:'RectEndCb'
}
])
}