JS Async并等待在Internet Explorer中工作

时间:2017-12-06 21:56:41

标签: javascript internet-explorer asynchronous

我已经让我的项目在所有其他浏览器中使用async / await,但显然它在IE中不兼容。

(async function () {
  try {
    await getLayers();
  }
  catch (err) {
    console.error(err)
  }
}());

调用我的其他函数:

async function getLayers() {  
try {
  $.when(
    await $.getJSON('http://' + ipAddress + '/api/Barriers/barrierGeoJSON', function (data) {
        createLayer(data[0].row_to_json, 'Barrier');
      }),
     await $.getJSON('http://' + ipAddress + '/api/DistPoints/distPointGeoJSON', function (data) {
        createLayer(data[0].row_to_json, 'Disturbance Points');
      })
  )}
  catch (err) {
    console.error(err);
  }
};

我需要帮助让这个代码在IE上运行。我必须使用某种填充剂或转换器吗?当它已经顺利运行时,我不想重写所有内容。目前正在运行客户端,我无法弄清楚如何使用async--await。提前谢谢你们。

1 个答案:

答案 0 :(得分:11)

我最终使用babel转换我的代码部分以使用IE11。此外,我必须导入polyfill,以便regeneratorRuntime函数可以工作。

它适用于所有浏览器

_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
  return regeneratorRuntime.wrap(function _callee$(_context) {
    while (1) {
      switch (_context.prev = _context.next) {
        case 0:
          _context.prev = 0;
          _context.next = 3;
          return getLayers();

        case 3:
          _context.next = 8;
          break;

        case 5:
          _context.prev = 5;
          _context.t0 = _context['catch'](0);

          console.error(_context.t0);

        case 8:
        case 'end':
          return _context.stop();
      }
    }
  }, _callee, this, [[0, 5]]);
}))();

'use strict';

var getLayers = function () {
  var _ref = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
    return regeneratorRuntime.wrap(function _callee$(_context) {
      while (1) {
        switch (_context.prev = _context.next) {
          case 0:
            _context.prev = 0;
            _context.t0 = $;
            _context.next = 4;
            return $.getJSON('http://' + ipAddress + '/api/Barriers/barrierGeoJSON', function (data) {
              createLayer(data[0].row_to_json, 'Barrier');
            });

          case 4:
            _context.t1 = _context.sent;
            _context.next = 7;
            return $.getJSON('http://' + ipAddress + '/api/DistPoints/distPointGeoJSON', function (data) {
              createLayer(data[0].row_to_json, 'Disturbance Points');
            });

          case 7:
            _context.t2 = _context.sent;

            _context.t0.when.call(_context.t0, _context.t1, _context.t2);

            _context.next = 14;
            break;

          case 11:
            _context.prev = 11;
            _context.t3 = _context['catch'](0);

            console.error(_context.t3);

          case 14:
          case 'end':
            return _context.stop();
        }
      }
    }, _callee, this, [[0, 11]]);
  }));

  return function getLayers() {
    return _ref.apply(this, arguments);
  };
}();

function _asyncToGenerator(fn) { return function () { var gen = fn.apply(this, arguments); return new Promise(function (resolve, reject) { function step(key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { return Promise.resolve(value).then(function (value) { step("next", value); }, function (err) { step("throw", err); }); } } return step("next"); }); }; }

;