Javascript 在JsTree中排序时拖放不起作用

我正在使用JsTree库使用以下JSON对象生成树视图

var data = [{"id":1,"parent":"#","text":"Items for Sale","icon":"fa fa-folder","state":{"opened":true,"disabled":false,"selected":false},"li_attr":{"order-num":1},"a_attr":[]},{"id":2,"parent":"#","text":"Service","icon":"fa fa-folder","state":{"opened":true,"disabled":false,"selected":false},"li_attr":{"order-num":2},"a_attr":[]},{"id":3,"parent":"#","text":"Vacancies","icon":"fa fa-folder","state":{"opened":true,"disabled":false,"selected":false},"li_attr":{"order-num":3},"a_attr":[]},{"id":4,"parent":"#","text":"Rent Property or Vehicle","icon":"fa fa-folder","state":{"opened":true,"disabled":false,"selected":false},"li_attr":{"order-num":4},"a_attr":[]},{"id":5,"parent":8,"text":"Electronics","icon":"fa fa-file","state":{"opened":true,"disabled":false,"selected":false},"li_attr":{"order-num":2},"a_attr":[]},{"id":6,"parent":8,"text":"Cars and Vehicles","icon":"fa fa-file","state":{"opened":true,"disabled":false,"selected":false},"li_attr":{"order-num":1},"a_attr":[]},{"id":7,"parent":1,"text":"Property","icon":"fa fa-file","state":{"opened":true,"disabled":false,"selected":false},"li_attr":{"order-num":1},"a_attr":[]},{"id":8,"parent":1,"text":"Home and Gardens","icon":"fa fa-file","state":{"opened":true,"disabled":false,"selected":false},"li_attr":{"order-num":2},"a_attr":[]},{"id":9,"parent":1,"text":"Fassion Health and Beauty","icon":"fa fa-file","state":{"opened":true,"disabled":false,"selected":false},"li_attr":{"order-num":3},"a_attr":[]},{"id":10,"parent":1,"text":"Hobbies Sports and Kids","icon":"fa fa-file","state":{"opened":true,"disabled":false,"selected":false},"li_attr":{"order-num":4},"a_attr":[]},{"id":14,"parent":2,"text":"Trade Services","icon":"fa fa-file","state":{"opened":true,"disabled":false,"selected":false},"li_attr":{"order-num":1},"a_attr":[]},{"id":15,"parent":2,"text":"Domestic Service","icon":"fa fa-file","state":{"opened":true,"disabled":false,"selected":false},"li_attr":{"order-num":2},"a_attr":[]},{"id":16,"parent":2,"text":"Events and Entertainment","icon":"fa fa-file","state":{"opened":true,"disabled":false,"selected":false},"li_attr":{"order-num":3},"a_attr":[]}];

我尝试使用ordernum值对树视图节点进行排序，然后通过拖放手动更改排序顺序。只能在拖动节点的第一个父UL内进行拖放。但问题是排序时，拖放不起作用。这是我的JsTree代码

$('#categories-wrapper').jstree({
        'core': {
            'data': data,
            "check_callback": true
        },
        "plugins": ["dnd", "sort"],
        'sort': function (a, b) {
            a1 = this.get_node(a);
            b1 = this.get_node(b);

            return (a1.li_attr['order-num'] > b1.li_attr['order-num']) ? 1 : -1;
        }
});

由于这个解决方案对我不起作用，我找到了另一个。这并不完美，但对我来说很有效

$('.jstree').on('ready.jstree', (e, data) => {
   data.instance.sort = () => {};
});

诀窍是在初始渲染后禁用排序。这就是代码的作用。树呈现后，不再需要排序。所以只需对空函数进行排序

---

确保将此代码放在$'.jstree.jstree.之前。

您要查找的确切行为是什么？这似乎是排序干预拖拽和下降；如果我禁用排序，我可以在第一个ul内拖放，但我认为您不需要这样做。我创作了一把小提琴：@JonathanChaplin，谢谢。我还需要通过仅在拖动节点的第一个父ul内拖放节点来手动更改节点顺序。我编辑了该问题，以解释我要寻找的确切行为。请尝试以下操作：