How to Iterate Over a Set in Vue.js?

Starting with Vue.js v3, you can iterate over a Set object using the v-for directive. Since a Set does not have any keys, you can simply get the value at each iteration like so:

<div id="app">
  <div v-for="number in numbers">
    {{ number }}
new Vue({
  el: '#app',
  data: {
    numbers: new Set(),
  created: function() {
    // ...

Please note that in versions prior to Vue.js v3, iterating over Set is not supported.

This post was published by Daniyal Hamid. Daniyal currently works as the Head of Engineering in Germany and has 20+ years of experience in software engineering, design and marketing. Please show your love and support by sharing this post.