leaferjs / ui

一款好用的 Canvas 渲染引擎,可用于高效绘图、UI 交互、小游戏、图形图像编辑,并支持自动布局。
https://www.leaferjs.com
MIT License
2.21k stars 75 forks source link

提问:toJSON或者 export 操作之后,交互操作好像都失去了响应 #128

Open a-boom opened 4 months ago

leaferjs commented 4 months ago

得上复现代码才能排查到原因

a-boom commented 4 months ago
const json = box.toJSON();
        let rectList = json.children;
        rectList = rectList.map(item => {
            item.stroke = undefined
            return item
        })
        const leaferSave = new Leafer({
            width: this.data.mainBoxSize,
            height: this.data.mainBoxSize
        }, json)
        let nowTime = new Date().getTime()
        leaferSave.export(`pixelVerse_${nowTime}.png`).then(res => {
            console.log(res)
            wx.showToast({
                title: '保存成功',
            })
        })

已经确定就是 export 操作之后导致原来的 leafer 无法交互

leaferjs commented 4 months ago

之前的版本的leafer传入json会有这个问题,最新版已经修复了 image

a-boom commented 4 months ago
image

引入的已经是最新发布的版本了

a-boom commented 4 months ago
const json = box.toJSON();
        let rectList = json.children;
        rectList = rectList.map(item => {
            item.stroke = undefined
            return item
        })
        let leaferSave = new Leafer({
            width: this.data.mainBoxSize,
            height: this.data.mainBoxSize
        })
        const group = new Group(json)
        leaferSave.add(group)
        let nowTime = new Date().getTime()
        leaferSave.export(`custom_${nowTime}.png`,{}).then(res => {
            wx.showToast({
                title: '保存成功',
            })
        })

通过注释代码排查 只要我创建了第二个 leafer(离屏画布) 就会导致页面上的 canvans 所创建的 leafer 无法操作

leaferjs commented 4 months ago

收到,谢谢反馈~, 后面修复下