剔除排序的嵌套项目不能拖动到无子元素中

Question

我正在使用可剔除排序，而我的目标是nestedSortable行为。 我有一个工作轻巧的小提琴示例 ，除了一件事情之外，其他一切都还不错：我不能将孩子转移到最初没有它的元素上。

子元素在那里打印：

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

即使删除了支票，仍然没有放置子元素的空间。 有什么好的解决方案可用于嵌套可剔除嵌套吗？

Answer 1

您只需要给它一些高度即可。 我拿出if ，就上一堂课

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

并将其命名为红色，以便您可以看到它

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

更新小提琴 。