Starting with Vue.js v3, you can iterate over a Map
object using the v-for
directive in the following way:
<div id="app"> <div v-for="[key, value] in abbreviations"> {{ key }} => {{ value }}; </div> </div>
new Vue({ el: '#app', data: { abbreviations: new Map(), }, created: function() { this.abbreviations.set('e.g.', 'example'); this.abbreviations.set('i.e.', 'that is'); this.abbreviations.set('no.', 'number'); // ... }, });
<!-- output: e.g. => example; i.e. => that is; no. => number; -->
Please note that in versions prior to Vue.js v3, iterating over Map
is not supported.
Hope you found this post useful. It was published . Please show your love and support by sharing this post.