[g-plugin-dragndrop] draggable / droppable 支持级联设置

xiaoiver commented 2 years ago

类似 visibility 和 pointerEvents

xiaoiver commented 2 years ago

但是按照 HTML 规范来看，draggable 并不是一个可继承属性： https://html.spec.whatwg.org/multipage/dnd.html#event-drag

在下面的例子中，我们需要单独给每个 <li> 设置可拖动，并不可以在 <ol> 上只设置一次：

<ol ondragstart="dragStartHandler(event)">
 <li draggable="true" data-value="fruit-apple">Apples</li>
 <li draggable="true" data-value="fruit-orange">Oranges</li>
 <li draggable="true" data-value="fruit-pear">Pears</li>
</ol>

xiaoiver commented 2 years ago

但我们应当支持在 Group 上或者祖先元素上设置这俩属性： https://codesandbox.io/s/pensive-hofstadter-0wsivx?file=/index.html

<div class="dropzone">
  <div id="draggable" draggable="true">
    <div>this is inner</div>
  </div>
</div>
<div class="dropzone"></div>

目前的实现只会在 target 上查找是否配置了 draggable，应当继续向上查找，如果能找到，需要修改 target 为最近的 draggable 元素，正如上面的例子中拖拽事件实际发生在 inner 上，但 target 为 #draggable：

 if (
  (isDocument && isDocumentDraggable) ||
  (target.getAttribute && target.getAttribute('draggable'))
)

antvis / G

[g-plugin-dragndrop] draggable / droppable 支持级联设置 #1088