Question

我有一个使用vue js的单页面应用程序。现在我必须从3个不同的源URL获取数据，然后需要在对象中映射以在应用程序上使用它。

或者在将其映射到后端后从一个URL获取它是否更好？

$.get(furl, function(data) {
  this.items1 = data;
});

$.get(furl, function(data) {
  this.items2 = data;
});

$.get(furl, function(data) {
  this.items3 = data;
});
// if I want to merge it here. I am not getting items1, items2, items3 here.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 1

使用承诺：

Promise.all([
  new Promise(function(resolve) {
    $.get( furl, function( data ) {
      resolve(data);
    });
  }),

  new Promise(function(resolve) {
    $.get( furl, function( data ) {
      resolve(data);
    });
  }),

  new Promise(function(resolve) {
    $.get( furl, function( data ) {
      resolve(data);
   });
  })
]).then(function(results) {
  // The items will be available here as results[0], results[1], results[2], etc.
});

写得更有效率和优雅：

function promisifiedGet(url) {
  return new Promise(function(resolve) {
    $.get(url, resolve);
  });
}

Promise.all([
  promisifiedGet(furl1),
  promisifiedGet(furl2),
  promisifiedGet(furl3)
]).then(function(results) {
  console.log(results);
});

Answer 2

看起来你正在使用jQuery进行ajax调用？在这种情况下，我建议使用when()来监视从ajax查询返回的被保护对象，并等待它们全部完成。

var a1 = $.get( furl, function( data ) {
            this.items1 = data;
   });


var a2 = $.get( furl, function( data ) {
            this.items2 = data;
   });


 var a3 = $.get( furl, function( data ) {
            this.items3 = data;
   });


$.when(a1, a2, a3, function(data1, data2, data3) {
   // here is where you merge them into your object and continue the rest of your code
   var o = {};
   o.items1 = data1;
   o.items2 = data2;
   o.items3 - data3;
});

Answer 3

您在函数内部使用this，如果存在use strict指令，则该函数可能是全局对象，也可能是未定义的。您是否尝试从回调函数中创建变量，并在每个回调中，将data添加到该数组？

像这样：

let results = {};
$.get( furl, function( data ) {
        results.items1 = data;
 });


$.get( furl, function( data ) {
        results.items2 = data;
 });


 $.get( furl, function( data ) {
        results.items3 = data;
 });

如何使用Javascript在单个对象中映射URL数据？

3 个答案: