vue component for listing a blog in typescript

index.ts
<template>
  <div>
    <h2>{{ title }}</h2>
    <ul>
      <li v-for="post in posts" :key="post.id">
        <router-link :to="{ name: 'blogPost', params: { id: post.id } }">
          {{ post.title }}
        </router-link>
      </li>
    </ul>
  </div>
</template>

<script lang="ts">
import Vue from 'vue';
import { Component } from 'vue-property-decorator';
import { BlogPost } from '@/models/blog-post'; // assuming you have a BlogPost interface or class

@Component({})
export default class BlogList extends Vue {
  title = 'Latest Posts';
  posts: BlogPost[] = [];

  created() {
    this.getPosts();
  }

  async getPosts() {
    // assuming you have a Vuex store and action to fetch the blog posts
    await this.$store.dispatch('fetchBlogPosts');

    this.posts = this.$store.getters.blogPosts;
  }
}
</script>
823 chars
36 lines