JavaScript ES6 curly braces in arguments to old-style JavaScript

Question

I'm using Vue/VueX inside a WebView, and while testing on an emulator with Android 5.0.2 which only has Chrome 30 support, I noticed that the page does not load.

I traced it down to the missing ES6 support, and decided to "downgrade" the page to the old-style JavaScript.

I'm having some issues with the following syntax

actions: {
  push_back_button       ({ commit }, callback)       { commit('push_back_button', callback)          },
  pop_back_button        ({ commit })                 { commit('pop_back_button')                     },
  ...

which I tried to translate to

actions: {
  push_back_button:       function (commit, callback)       { commit('push_back_button', callback)          },
  pop_back_button:        function (commit)                 { commit('pop_back_button')                     },
  ...

But I'm getting a message during load that Uncaught TypeError: commit is not a function .

How would I do this properly? I am not using any stuff like webpack, this runs in the Browser/WebView as-is and the ES6 version of the page works fine on devices which support it.

Answer 1

push_back_button and pop_back_button expects first parameter to be an object.

({ commit }) deconstructs object parameter to get it's property commit

actions: {
  push_back_button:       function (object, callback)       { object.commit('push_back_button', callback)          },
  pop_back_button:        function (object)                 { object.commit('pop_back_button')                     },
}

 function fn(parent) { console.log("called from", parent); } function es5_fn(object) { object.fn("es5_fn"); } function es6_fn({fn}) { fn("es6_fn"); } es5_fn({fn}); es6_fn({fn}); 

Answer 2

That's because ({commit}) is translated by (item) where item is an object containing at least commit .

Can you try this:

actions: {
  push_back_button:       function (item, callback)       { item.commit('push_back_button', callback)          },
  pop_back_button:        function (item)                 { item.commit('pop_back_button')                     },
  ...