没有键修饰符的fabric js中的多选

Question

我想知道是否有一种方法可以在 fabric js canvas 中主动设置 multi-selection "mode" 而无需按住 shift？

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

我一直在阅读 fabricjs 文档，但没有发现任何关于不带 shift 修饰键的 multi-select 的内容。

我不确定我的请求是否有效，但不胜感激。

所以基本上我会监听 mouse:down 事件并检查我的布尔值是否为 true/false，如果是，我想进入 multi-selection 模式。

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

Answer 1

您可以侦听 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);
  }
});

没有键修饰符的fabric js中的多选

Multiselect in fabric js without key modifier

javascript

fabricjs

vue.js