render home view

1 files changed, 15 insertions, 0 deletions

diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index 5d3102c..a5290ec 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -1,7 +1,22 @@
 <script setup lang="ts">
+import { onMounted } from 'vue'
+import { useNewsStore } from '@/stores/news'
+
+const store = useNewsStore()
+
+onMounted(() => {
+  store.fetchTopHeadlines({ country: 'us' })
+})
 </script>
 
 <template>
   <main>
+    <p v-if="store.loading">Loading...</p>
+    <p v-else-if="store.error">{{ store.error }}</p>
+    <ul v-else>
+      <li v-for="article in store.articles" :key="article.url">
+        <a :href="article.url" target="_blank">{{ article.title }}</a>
+      </li>
+    </ul>
   </main>
 </template>