#100DaysOfWeb in Python Transcripts
Chapter: Days 93-96: Vue.js - JavaScript user interfaces
Lecture: Concept: Repeating data

Login or purchase this course to watch this video and the rest of the course contents.
0:00 Let's review this idea of rendering repeated data. We saw that we used the double handlebars or double mustaches to render just plain text.
0:09 But, if we've got some kind of loop some kind of iteration that we need to do, for example here we have these movies
0:16 and we want to show some piece of HTML for each movie. Well, you can use the v-for. Remember, most of the commands start with v-
0:24 as in view, and then the for command. So we can loop over the movies from our model from our data, it's an array in Javascript
0:31 and then we're going to get a local loop variable called m which we can then use over here. So we're going to render the title
0:38 and we're going to even uppercase it by calling a function on m.title.toLocaleUpperCase. Pretty straightforward, right?
0:44 I guess one additional thing to emphasize here is the element that actually has the v-foron it is also replicated.
0:51 So, what we're going to get is a div with the class movie and then containing a div with class title
0:57 for each movie and when we do the v-for. There you go. You've got data you got to repeat, well, v-for.

Talk Python's Mastodon Michael Kennedy's Mastodon