Go back to Examples

Looping collection items

CMS - Intermediate

Using `v-for` allows you to loop collection item content. Combined with `v-html` and `v-bind` you can create dynamic content pages.

                <div class="row">
    <template v-for="post in posts">
        <div class="col">
            <h1 v-html="post.name"></h1>
            <img v-bind:src="post.image" />
        </div>
    </template>
</div>
Bind HTML attributes Conditional rendering