Prices

Let's now add thepricelist to our template as well.

index.html:

<p class="lists">
  <hr>
  <p class="amenities list">...</p>
  <hr>
  <p class="prices list">
    <p class="title">
      <strong>Prices</strong>
    </p>
    <p class="content">
      <p class="list-item" v-for="price in prices">
        {{ price.title }}: <strong>{{ price.value }}</strong>
      </p>
    </p>
  </p>
</p>

I'm sure you'll agree that looping a template is far easier than writing out every item. However, you may notice that there is still some common markup between these two lists. Later in the book we'll utilizecomponentsto make this part of the template even more modular.