javascript - 可 knockout 排序的嵌套项目无法拖动到无子元素中

Question

我正在使用knockout-sortable我的目标是nestedSortable行为。我有一个可以工作的轻量级 fiddle example我已经完成了，一切都很好，除了一件事:我无法将 child 移动到最初没有它的元素。

子元素打印在那里:

<div data-bind="if: children().length > 0">
    <ul data-bind="sortable: { template: 'tpl', data: $data.children }"></ul>            
</div>

即使检查被删除，仍然没有空间放置子元素。对于 knockout 的嵌套排序是否有好的解决方案？

Answer 1

你只需要给它一些高度。我拿出了if，在ul上放了一个类

<div>
  <ul class="sort-drop" data-bind="sortable: { template: 'tpl', data: $data.children }"></ul>
</div>

并将其设置为红色，以便您可以看到它

.sort-drop:empty {
  background-color: red;
  min-height: 5px;
}

Updated fiddle .