使用editor功能，如何只在导出图片时去除选中框而不影响原图显示的编辑框

[ghfkui]

使用editor功能，editor内有大量的元素，点击选择元素出现编辑框。 现在有一个导出的需求：将editor内所有的元素导出为一张图片，图片内不显示编辑框。 之前采用如下代码实现

app.syncExport('png')

这样会将编辑框也导出到图片中。如何只在导出图片时去掉编辑框？

[Xdy1579883916]

那就是你写的不对

import { App, Rect } from 'leafer-ui'
import '@leafer-in/export' // 引入导出元素插件  

const leafer = new App({ view: window, editor: {}})

const rect = Rect.one({ fill: '#32cd79', editable: true }, 100, 100)
leafer.tree.add(rect)
leafer.editor.select(rect)

setTimeout(() => {
    rect.export('test.png', true)
}, 3000)

[ghfkui]

那就是你写的不对

import { App, Rect } from 'leafer-ui' import '@leafer-in/export' // 引入导出元素插件

const leafer = new App({ view: window, editor: {}})

const rect = Rect.one({ fill: '#32cd79', editable: true }, 100, 100) leafer.tree.add(rect) leafer.editor.select(rect)

setTimeout(() => { rect.export('test.png', true) }, 3000) 感谢回答，你这种写法肯定没有问题，但是如果canvas有多个元素，想把所有元素都下载到一张图片上这种写法就有问题了

[Xdy1579883916]

给一个示例看看你说的问题

[Xdy1579883916]

如果要导出多个元素,你需要用一个容器,例如 Group

题外话: 遇到问题如果描述的清晰一些, 可以让别人更好的理解并尽快帮助你

import { App, Rect, Group} from 'leafer-ui'
import '@leafer-in/export' // 引入导出元素插件  

const leafer = new App({ view: window, editor: {}})

const rect2 = Rect.one({ fill: '#32cd79', editable: true }, 100, 100)
leafer.tree.add(rect2)

const rect = Rect.one({ fill: '#32cd79', editable: true }, 400, 400)
leafer.tree.add(rect)
leafer.editor.select([rect2, rect])
const group = new Group()
// group
setTimeout(() => {
    leafer.app.editor.list.forEach(v => {
        v.clone().dropTo(group)
    })
    group.export('test.png', true)
}, 3000)

[ghfkui]

如果要导出多个元素,你需要用一个容器,例如 Group

题外话: 遇到问题如果描述的清晰一些, 可以让别人更好的理解并尽快帮助你

import { App, Rect, Group} from 'leafer-ui' import '@leafer-in/export' // 引入导出元素插件

const leafer = new App({ view: window, editor: {}})

const rect2 = Rect.one({ fill: '#32cd79', editable: true }, 100, 100) leafer.tree.add(rect2)

const rect = Rect.one({ fill: '#32cd79', editable: true }, 400, 400) leafer.tree.add(rect) leafer.editor.select([rect2, rect]) const group = new Group() // group setTimeout(() => { leafer.app.editor.list.forEach(v => { v.clone().dropTo(group) }) group.export('test.png', true) }, 3000)

感谢提醒 @Xdy1579883916 。重新修改了问题描述。我认为应该有个层的概念，只导出那一个层就好了，不知道是哪个字段决定