From the course: Vue.js 3 Essential Training

Unlock this course with a free trial

Join today to access over 22,500 courses taught by industry experts.

Rendering lists

Rendering lists

- [Instructor] One of the most useful things that view can help you do is rendering lists of data. To do that, we use a directive called V-for, and here's what it looks like. The V-for directed lest we create a temporary variable, which I'm calling here my item from either a number, an array or an object. And here I'm calling that my element. Then you can use that temporary variable in an expression or a more complicated template as you loop through each of the value in my elements. If you want to just repeat something a few times you can use a number for the element and then the loop will repeat the expression or template that many times, You can use of instead of N so that it looks more like how JavaScripts similar command would be written. You'll probably see that in notation more often when looking at view code. You can add an index variable and this will give you a number for each instance of the list. Like with…

Contents