Vue.js 2 Web Development Projects

Template

The <template> tag contains the template of the component. Like earlier, it is HTML with the Vue special syntax (directives, text interpolation, shorthands, and so on).

Here's an example of a <template> tag in an SFC:

<template>  <ul class="movies">    <li v-for="movie of movies" class="movie">      {{ movie.title }}    </li>  </ul></template>

In this example, the template of our component will consist of a ul element containing a list of li elements displaying the titles of the movies.

If you don't put a <template> tag in your SFC, you will need to write a render function or your component won't be valid.