RubaXa/Sortable 使用 Polymer 取消物品掉落

Question

我正在使用 Rubaxas sortable.js 太棒了。

现在我尝试取消掉落但它不起作用。

文档说：

onMove: function (/**Event*/evt) {
    // Example: http://jsbin.com/tuyafe/1/edit?js,output
    evt.dragged; // dragged HTMLElement
    evt.draggedRect; // TextRectangle {left, top, right и bottom}
    evt.related; // HTMLElement on which have guided
    evt.relatedRect; // TextRectangle
    // return false; — for cancel
}

所以我在 this 示例中尝试了这个：

代码：

<sortable-js id="sortable" animation="1000" filter=".noDrag" on-move="_elementMoving" on-end="_elementMoved" force-fallback="true", fallback-class="fallback">
  <template is="dom-repeat" items="{{items.images}}">
    <admin-image index$="{{index}}" type="{{type}}"  image-set="{{_hasImage(item)}}" class$="admin_image {{_isDraggable(item, items, item.cover)}}" item="{{item}}"></admin-image>  
  </template>
</sortable-js>

_elementMoving() 函数：

_elementMoving : function(e){
    return e.related.className.indexOf('noDrag') === -1;
  }
},

那么我做错了什么？

@RubaXa

不胜感激。

Answer 1

我这样解决了我的问题：

我没有使用 filter，而是使用了 draggable。

代码：

<sortable-js id="sortable" animation="1000" draggable=".drag" on-move="_elementMoving" on-end="_elementMoved" force-fallback="true", fallback-class="fallback">
  <template is="dom-repeat" items="{{items.images}}">
    <admin-image  index$="{{index}}" type="{{type}}"  image-set="{{_hasImage(item)}}" class$="admin_image {{_isDraggable(item, items, item.cover)}}" item="{{item}}"></admin-image>  
  </template>
</sortable-js>

_elementMoving功能保持不变。

RubaXa/Sortable 使用 Polymer 取消物品掉落

RubaXa/Sortable cancel item drop using Polymer

javascript

polymer

rubaxa-sortable

polymer-1.0