Jstree增加刷新回调方法

这是最近遇到的问题，在使用jstree创建节点后，需要刷新树状数据并选中创建的结点。翻阅了jstree的api，发现他的refresh方法中并没有回调这个概念。这种情况下就只有和后端开发接口的人员协商解决了。

方案1：在加载数据的接口中返回最新创建的结点ID，但显然比较难做到

方案2：创建结点后刷新数据，并返回创建结点的id，由前端人员设置选中它。

方案3：不刷新数据，在已知位置用后端返回的结点数据前前端创建一个新结点。并选中它。

感觉这三种方案都能达到目的，第一种方案前端几乎不用改动，全靠后端接口判断。第二种方案在jstree中新增加一个刷新后附带回调方法，这种方案修改了jstree，其实我也觉得不是很好，主要还是由于我的回调掌握的不是很好，练习练习 囧

首先修改jstree文件，这里我使用的jstree版本为：jsTree 3.2.1

/**
* 首先找到以下代码
* refresh : function (skip_loading, forget_state)
* 我采取的方法是复制这段代码，新增加一个refresh_clb方法
* refresh_clb: function (cbk,skip_loading,forget_state)
* 看参数就能够知道，只是在前面加了一个cbk参数，阅读刷新方法，可以发现它在获取数据后做了一个load方法，我在load的最后加了一句
* cbk && cbk();
*/

refresh_clb: function (cbk,skip_loading,forget_state){
this._data.core.state = forget_state === true ? {} : this.get_state();
if(forget_state && $.isFunction(forget_state)) { this._data.core.state = forget_state.call(this, this._data.core.state); }
this._cnt = 0;
this._model.data = {};
this._model.data[$.jstree.root] = {
id : $.jstree.root,
parent : null,
parents : [],
children : [],
children_d : [],
state : { loaded : false }
};
this._data.core.selected = [];
this._data.core.last_clicked = null;
this._data.core.focused = null;

var c = this.get_container_ul()[0].className;
if(!skip_loading) {
this.element.html("<"+"ul class='"+c+"' role='group'><"+"li class='jstree-i
4000
nitial-node jstree-loading jstree-leaf jstree-last' role='treeitem' id='j"+this._id+"_loading'><i class='jstree-icon jstree-ocl'></i><"+"a class='jstree-anchor' href='#'><i class='jstree-icon jstree-themeicon-hidden'></i>" + this.get_string("Loading ...") + "</a></li></ul>");
this.element.attr('aria-activedescendant','j'+this._id+'_loading');
}
this.load_node($.jstree.root, function (o, s) {
if(s) {
this.get_container_ul()[0].className = c;
if(this._firstChild(this.get_container_ul()[0])) {
this.element.attr('aria-activedescendant',this._firstChild(this.get_container_ul()[0]).id);
}
this.set_state($.extend(true, {}, this._data.core.state), function () {
/**
* triggered when a `refresh` call completes
* @event
* @name refresh.jstree
*/
this.trigger('refresh');
});
cbk && cbk();
}
this._data.core.state = null;

});
}

接下来就是创建后刷新回调的方法了：

说明一下，我们的数据统一都是用ajax读取获得的，所以这段代码其实是写在success当中的：

success: function (data, textStatus, xhr) {
if (data.Flag == true) {
cleanFrom("add");
var ref = $('#companyTree').jstree(true);
var _data=data;
let cbkFun=function(){
var node=ref.get_node(_data.Id);
ref.deselect_all();
ref.select_node(node);
}
ref.refresh_clb(cbkFun);
messager(data.Message);

}
}