Now that the HomePage component has data available, we can work on displaying it.
To begin with, clear out the existing content of the component and replace it with a div. This div will feature a v-for directive to iterate through each of our listing groups. Since listing_groups is an object with key/value pairs, we'll give our v-for two aliases: group and country, which are the value and key of each object item respectively.
We will interpolate country inside a heading. group will be used in the next section.
resources/assets/components/HomePage.vue:
<template> <div> <div v-for="(group, country) in listing_groups"> <h1>Places in {{ country }}</h1> <div> Each listing will go here </div> </div> </div> </template>
