请求后台的数据比较多。如何防止调用数据没有返回,
请求数据比较久,别的方法调用怎么办。
$(function() { init_superlier_technology_material(); if(flag){ load_before(headId); } }); //初始化,供应的下拉数据 function init_superlier_technology_material(){ $.post('/admin/supplier/list', {page:1,limit:10000}, function (result) { superlier_select_arr = result.data; }, 'json'); $.post('/admin/material/list', {page:1,limit:10000}, function (result) { material_select_arr = result.data; }, 'json'); } function load_before(headId){ $.post('/admin/ycl/head/find/by/id', {id: headId}, function (result) { //拿到的数据加载到select_array 里面。 result.yuanCaiLiaoList.forEach((item)=>{ var obj = {}; obj.row = row; obj.id = item.id;//这是加载的数据的id 添加的行,是没有这个id,只有修改有这个id let material_html = get_material_html(item.material.id); let supplier_html = get_supplier_html(item.supplier.id); select_array.push(obj); $("#ruku_list table tbody").append(' ' + '<tr row="'+row+'" style="cursor: pointer; ">\n' + ' <td style="text-align: center; padding: 0px; " > ' + material_html + ' </td>\n' + ' <td style="text-align: center; padding: 0px; " > ' + supplier_html + ' </td>\n' + ' ' </tr>'); row++; w_form.render(); //更新全部表单 init_del_click(); listen_key_code();//监听键盘 }); }, 'json'); } 如果init_superlier_technology_material 请求数据过长,那么 load_before加载数据 superlier_select_arr可能并没有数据。 这种情况 如何 预防
为避免在`load_before`函数中使用`superlier_select_arr`和`material_select_arr`时可能为空的情况,您可以在`load_before`函数中添加一个检查, 确保`init_superlier_technology_material`函数已经完成数据加载后再执行相关逻辑。这可以通过使用Promise来实现。以下是对您代码的修改建议: $(function() { timer1 = setInterval(record_select_array_row_data,200); if(flag){ console.log("这是修改"); init_superlier_technology_material().then(function() { load_before(headId);//根据id加载。 }); }else{ init_superlier_technology_material(); console.log("这是添加"); } }); // 初始化,供应商、材质、工艺的下拉数据 function init_superlier_technology_material() { return new Promise(function(resolve, reject) { let promise1 = new Promise(function(resolve, reject) { $.post('/admin/supplier/list', {page:1, limit:10000}, function(result) { superlier_select_arr = result.data; resolve(); }, 'json'); }); let promise2 = new Promise(function(resolve, reject) { $.post('/admin/material/list', {page:1, limit:10000}, function(result) { material_select_arr = result.data; resolve(); }, 'json'); }); Promise.all([promise1, promise2]).then(function() { resolve(); }); }); } function load_before(headId) { if (!superlier_select_arr || !material_select_arr) { console.log("数据加载未完成,无法执行load_before函数"); return; } $.post('/admin/ycl/head/find/by/id', {id: headId}, function(result) { // 拿到的数据加载到select_array 里面。 result.yuanCaiLiaoList.forEach((item) => { var obj = {}; obj.row = row; obj.id = item.id; // 这是加载的数据的id,添加的行,是没有这个id,只有修改有这个id let material_html = get_material_html(item.material.id); let supplier_html = get_supplier_html(item.supplier.id); select_array.push(obj); $("#ruku_list table tbody").append(' ' + '<tr row="' + row + '" style="cursor: pointer;">\n' + ' <td style="text-align: center; padding: 0px;"> ' + material_html + ' </td>\n' + ' <td style="text-align: center; padding: 0px;"> ' + supplier_html + ' </td>\n' + ' </tr>'); row++; w_form.render(); // 更新全部表单 init_del_click(); listen_key_code(); // 监听键盘 }); }, 'json'); } ``` 通过以上修改,您可以确保在数据加载完成后再执行`load_before`函数,避免数据加载未完成就开始使用的问题。
var superlier_select_arr, material_select_arr, arr2; var superlier_promise = new Promise((resolve, reject) => { $.post('/admin/supplier/list', { page: 1, limit: 10000 }, function (result) { superlier_select_arr = result.data; resolve(); }, 'json'); }); var init2 = new Promise((resolve, reject) => { $.post('/admin/data/list', { page: 1, limit: 10000 }, function (result) { arr2 = result.data; resolve(); }, 'json'); }); var material_promise = new Promise((resolve, reject) => { $.post('/admin/material/list', { page: 1, limit: 10000 }, function (result) { material_select_arr = result.data; resolve(); }, 'json'); }); function init_superlier_technology_material() { return Promise.all([superlier_promise, material_promise, init2]); } $(function() { init_superlier_technology_material().then(() => { // 初始化完成后的操作 }); }); function add() { Promise.all([superlier_promise, material_promise, init2]).then(() => { // 在这里调用add函数时,确保superlier_select_arr和material_select_arr, arr2已经被正确初始化 }).catch((error) => { console.error('Error initializing data: ', error); }); } 我这样改代码对吗。
您的修改是正确的,通过将每个异步请求都封装成Promise对象,并使用Promise.all来等待它们全部完成后再执行后续操作,
确保了在调用add函数时,superlier_select_arr、material_select_arr和arr2都已经被正确初始化。
在您的代码中,superlier_promise、material_promise和init2是三个分别处理供应商、材质和其他数据请求的Promise对象。
在init_superlier_technology_material函数中,使用Promise.all来同时等待这三个Promise对象的完成。
在add函数中,同样使用Promise.all来等待这三个Promise对象的完成,确保在调用add函数时,所有数据都已经准备好了。
这种写法可以有效地处理多个异步请求并确保它们的顺序和完成状态,是一个很好的解决方案。您可以根据需要在初始化完成后执行相应的操作。
站长微信:xiaomao0055
站长QQ:14496453