#12 - Iteration Rendering (Looping) - Vue 3 (Options API) Tutorial

In this Vue 3 tutorial, we learn how to render elements by iterating (looping) through data. We cover the binding directives, required attributes, objects and arrays, nested elements and conditional loops. We cover the following topics: 1. Iteration Rendering 2. The v-for iteration directive 3. The key attribute 4. How to get an element's index in the loop 5. How to iterate through an array of objects 6. How to iterate through nested arrays 7. How to iterate through objects 8. How to get an object's key 9. Conditional looping with v-for, v-if and Computed Properties _Note that this tutorial is for the Vue 3 Options API (which is similar to Vue 2). We later move on to the Composition API and then the Script Setup (3.2 update)_ This lesson is also available in written format https://www.koderhq.com/tutorial/vue/iteration-rendering/ Check out the Vue 3 for Beginners playlist for more Vue tutorial videos https://www.youtube.com/playlist?list=PLFAU47Id44XG48v5dPPTGMgJfjMnsU8Bw Subscribe to the channel and never miss a lesson https://www.youtube.com/channel/UCz6k9pRLevdJGAsMMAVSb_Q?sub_confirmation=1 Visit the website for a wide range of programming tutorials https://www.koderhq.com