Array destructuring in v-for

[posva]

Moved from vuejs/vue#4884

According to https://github.com/vuejs/vue-loader/blob/v10.0.0/docs/en/features/es2015.md#es2015-in-templates, object destructuring is possible. What about arrays?

export default {
  data() {
    return {
      map: new Map([['a', 1], ['b', 2]])
    }
  }
}

<div v-for="[ key, value ] in Array.from(map)"></div>

Compilation fails for me with:

ERROR in ./~/vue-loader/lib/template-compiler.js?id=data-v-b057b41e!./resources/assets/js/modulos/ventas/facturas/show/template.html
Module parse failed: C:\Users\Carlos\Dev\compuservice\web\salesmaster\node_modules\vue-loader\lib\template-compiler.js?id=data-v-b057b41e!C:\Use
rs\Carlos\Dev\compuservice\web\salesmaster\resources\assets\js\modulos\ventas\facturas\show\template.html Unexpected token (35:11)
You may need an appropriate loader to handle this file type.
|     staticClass: "panel-heading"
|   }, [_vm._v("Devoluciones")]), _vm._v(" "), _vm._l((Array.from(_vm.devoluciones)), function(ref) {
|     var _vm.key = ref[0];
|     var _vm.value = ref[1];
|
 @ ./resources/assets/js/modulos/ventas/facturas/show/index.vue 5:2-118
 @ ./resources/assets/js/app.js
 @ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./resources/assets/js/app.js ./resources/assets/sass/app.scss`

Relevant: Map.prototype[@@iterator]()

[posva]

Ha, it may actually be because of the compiler. The generated code is:

    var _vm.val = ref[0];
    var _vm.key = ref[1];

(which is wrong because of the var + _vm.val+

[rhyek]

If you need me to test anything, just let me know.

[kazupon]

Yeah, vue-template-es2015-compiler have a bug.
We need to fix this.

[yyx990803]

Fixed in vuejs/vue-template-es2015-compiler@96d2570