layui-formSelects下拉多选的数据回显异步回调问题

做下拉多选时候，formselects和我要回显查询的数据异步问题，但是官方文档的数据赋值之后没有回调

在数据赋值之后再回调渲染选中的信息

这些是官方给出的信息
/**
 * 1.多选数据赋值
 *
 * formSelects.data(ID, type, config);
 *
 * @param ID            xm-select的值
 * @param type          'local' | 'server', 本地数据或者远程数据
 * @param config        配置项
 *          arr             本地数据数组
 *          url             远程数据链接
 *          keyword         远程数据搜索内容, 其他附加数据可以使用 formSelects.config设置
 *          linkage         是否为联动多选
 *          linkageWidth    联动多选没级宽度
 */
 
//以下代码可以在console中运行测试, 结果查看基础示例第一个
var formSelects = layui.formSelects;
 
 两种形式渲染数据
 
//local模式
formSelects.data('select1', 'local', {
    arr: [
        {"name": "分组-1", "type": "optgroup"},
        {"name": "北京", "value": 1},
        {"name": "上海", "value": 2},
        {"name": "分组-2", "type": "optgroup"},
        {"name": "广州", "value": 3},
        {"name": "深圳", "value": 4},
        {"name": "天津", "value": 5}
    ]
});
 
//server模式
formSelects.data('select1', 'server', {
    url: 'https://www.fastmock.site/mock/29487363107ab7d242c46305cadf4c52/formSelects/layui/data',
    keyword: '水果'
});

下边是选中赋值操作，粘贴的官方的

<div class="layui-form">
    <select name="city" xm-select="example2_2">
        <option value="1" selected="selected">北京</option>
        <option value="2">上海</option>
        <option value="3">广州</option>
        <option value="4">深圳</option>
        <option value="5">天津</option>
    </select>
    <js>
        layui.formSelects.value('example2_2', []);          //赋值空数组, 清空所有
        layui.formSelects.value('example2_2', [1, 2]);      //赋值 北京,上海
        layui.formSelects.value('example2_2', [5], true);   //追加赋值 天津
        layui.formSelects.value('example2_2', [1], false);  //删除 已选择 [北京]
    </js>
</div>

下边是我自己写的

formselects.config('select_base_cityname', {
    keyName: 'title',//自定义返回数据中name的key, 默认 name
    keyVal: 'id',//自定义返回数据中value的key, 默认 value
},true);
formselects.data('select_base_cityname', 'server', {
    url: '/website/enterlake/scenerytags_listselect',
})

翻看formSelects-v4.js代码找到调用的这个data方法

Select4.prototype.data = function (id, type, config) {
		if (!id || !type || !config) {
			common.log('id: ' + id + ' param error !!!');
			return this;
		}
		if (!common.check(id)) {
			common.log('id: ' + id + ' not render !!!');
			return this;
		}
		this.value(id, []);
		this.config(id, config);
		if (type == 'local') {
			common.renderData(id, config.arr, config.linkage == true, config.linkageWidth ? config.linkageWidth : '100');
		} else if (type == 'server') {
			var datas = common.ajax(id, config.url, config.keyword, config.linkage == true, config.linkageWidth ? config.linkageWidth : '100');//这里调用的ajax方法，原理就是在ajax的success方法之后回调
		}
		
    	
		return this;
	};

然后找到common.ajax发现有很多传参，只是上面的方法没有传回调参数

Common.prototype.ajax = function (id, searchUrl, inputValue, isLinkage, linkageWidth, isSearch, successCallback, isReplace) {
		var _this5 = this;
		var reElem = $('.' + PNAME + ' dl[xid="' + id + '"]').parents('.' + FORM_SELECT);
		if (!reElem[0] || !searchUrl) {
			return;
		}
		var ajaxConfig = ajaxs[id] ? ajaxs[id] : ajax;
		var ajaxData = $.extend(true, {}, ajaxConfig.data);
		ajaxData[ajaxConfig.searchName] = inputValue;
		//是否需要对ajax添加随机时间
		//ajaxData['_'] = Date.now();
		$.ajax({
			type: ajaxConfig.type,
			headers: ajaxConfig.header,
			url: searchUrl,
			data: ajaxConfig.dataType == 'json' ? JSON.stringify(ajaxData) : ajaxData,
			success: function success(res) {
				if (typeof res == 'string') {
					res = JSON.parse(res);
				}
				ajaxConfig.beforeSuccess && ajaxConfig.beforeSuccess instanceof Function && (res = ajaxConfig.beforeSuccess(id, searchUrl, inputValue, res));
				if (_this5.isArray(res)) {
					var newRes = {};
					newRes[ajaxConfig.response.statusName] = ajaxConfig.response.statusCode;
					newRes[ajaxConfig.response.msgName] = "";
					newRes[ajaxConfig.response.dataName] = res;
					res = newRes;
				}
				if (res[ajaxConfig.response.statusName] != ajaxConfig.response.statusCode) {
					reElem.find('dd.' + FORM_NONE).addClass(FORM_EMPTY).text(res[ajaxConfig.response.msgName]);
				} else {
					reElem.find('dd.' + FORM_NONE).removeClass(FORM_EMPTY);
					_this5.renderData(id, res[ajaxConfig.response.dataName], isLinkage, linkageWidth, isSearch, isReplace);
					data[id].config.isEmpty = res[ajaxConfig.response.dataName].length == 0;
				}
				successCallback && successCallback(id);//然后这里发现有回调信息，只是上一个方法没有传参，然后我又回去修改Select4.prototype.data这个方法
				ajaxConfig.success && ajaxConfig.success instanceof Function && ajaxConfig.success(id, searchUrl, inputValue, res);
			},
			error: function error(err) {
				reElem.find('dd[lay-value]:not(.' + FORM_SELECT_TIPS + ')').remove();
				reElem.find('dd.' + FORM_NONE).addClass(FORM_EMPTY).text('服务异常');
				ajaxConfig.error && ajaxConfig.error instanceof Function && ajaxConfig.error(id, searchUrl, inputValue, err);
			}
		});
	};

下边是做了修改的

Select4.prototype.data = function (id, type, config,callback) {//这里增加了一个回调参数callback
		if (!id || !type || !config) {
			common.log('id: ' + id + ' param error !!!');
			return this;
		}
		if (!common.check(id)) {
			common.log('id: ' + id + ' not render !!!');
			return this;
		}
		this.value(id, []);
		this.config(id, config);
		if (type == 'local') {
			common.renderData(id, config.arr, config.linkage == true, config.linkageWidth ? config.linkageWidth : '100');
		} else if (type == 'server') {
			var datas = common.ajax(id, config.url, config.keyword, config.linkage == true, config.linkageWidth ? config.linkageWidth : '100',false,function (s) {这里加了两个参数，function是第七位，前边就加了个false
				if(typeof callback == "function"){
					callback(s);//判断一下，然后回调
				}
			  });
		}
		
    	
		return this;
	};

前端也做相应更改，接收回调信息，然后调用自己封装好的方法

formselects.data('select_base_cityname', 'server', {
    url: '/website/enterlake/scenerytags_listselect',
},function(e) {//这里对应上一个方法的callback
    console.log(e)
    // selectdata()//调用要渲染的数据
});