首页 > 解决方案 > 没有键修饰符的fabric js中的多选

问题描述

我想知道是否有一种方法可以在fabric js画布中主动设置多选“模式”而不按住shift?

我希望通过监听绑定到复选框的布尔值来激活多选。

我一直在阅读 fabricjs 文档,没有发现任何关于没有 shift 修饰键的多选的信息。

我不确定我的请求是否有效,但任何指针将不胜感激。

所以基本上我监听 mouse:down 事件并检查我的布尔值是否为真/假,如果为真,我想进入多选模式。

canvas.on('mouse:down', evt => {
  if(this.multiSelect) {
    // activate multi-select
 }
}

标签: javascriptvue.jsfabricjs

解决方案


您可以收听该selection:created事件,然后将每个新选择推送到一个数组中,然后您将使用该数组创建一个ActiveSelection包含多个对象的数组。当您设置this.multiSelect为 false 时,您还需要清空multiSelection数组。像这样的东西:

var multiSelection = [];
canvas.on('selection:created', selected => {
  if(this.multiSelect) {
    multiSelection.push(selected);
    var groupSelection = new fabric.ActiveSelection(multiSelection)
    canvas.setActiveObject(groupSelection);
  }
});

推荐阅读