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 }}
  </div>
</div>

new Vue({
  el: '#app',
  data: {
    numbers: new Set(),
  },
  created: function() {
    this.numbers.add(30);
    this.numbers.add(20);
    this.numbers.add(50);
    // ...
  },
});

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