Javascript Syntax of function, issue in Internet Explorer <= 11 (vuejs)

Question

This code on Internet explorer <= 11, doesn't work (only on edge works)

Bus.$on('UpdateCartData', (event) => {
  this.cart = event.cart;
  this.cart_options = event.cart_options;
});

Says SCRIPT1002: Syntax error

When I transform it through Babel polyfill, suggests to transform it to:

Bus.$on('UpdateCartData', function (event) {

As this doesn't shows Syntax error anymore, but the logic and functionallity stops working even on Google Chrome.

Any ideas what to do?

Pretty surely that's not the only transformation that Babel did. — Bergi, May 14 '18 at 13:21
Yes, you are correct. Replaced (this.cart = event.cart;) with (undefined.cart = event.cart;) — Анжел Миленов, May 14 '18 at 13:42

score 0 · Answer 1 · answered May 14 '18 at 12:27

The duplicate link helped me to understand the structure.

"Defined in ECMA Script 6, arrow-functions adopt the this binding from the enclosing (function or global) scope."

so should be:

var vm = this;
      Bus.$on('UpdateCartData', function (event) {
        vm.cart = event.cart;
        vm.cart_options = event.cart_options;
      });
}

Javascript Syntax of function, issue in Internet Explorer <= 11 (vuejs)

1 Answers1