[Vuejs]-Vue component methods not firing

Your mounted function is inside your methods object.
Move it out like this:

<template>
  <div class="blog-post">
    <h2>{{ title }}</h2>
    <p>{{ body }}</p>
    <div class="comment-section">
      <Comment
        v-for="comment in comments"
        v-bind:key="comment.id"
        :name="comment.name"
        :email="comment.email"
        :body="comment.body"
      />
    </div>
  </div>
</template>

<script>
import axios from "axios";
import Comment from "./Comment";

export default {
  name: "Post",
  props: {
    title: String,
    body: String,
    postId: Number,
  },
  components: {
    Comment,
  },
  data() {
    return {
      comments: [
        {
          name: "comment name",
          email: "comment email",
          body: "comment body",
          postId: 1,
          id: 1,
        },
      ],
    };
  },
  methods: {
    async getPostData() {
      const url = `https://jsonplaceholder.typicode.com/comments`;
      const response = await axios.get(url);
      const data = await response.data;
      this.comments = data.map((comment) => ({
        name: comment.name,
        email: comment.email,
        body: comment.body,
        postId: comment.postId,
        id: comment.id,
      }));
    },
  },
  mounted() {
      this.getPostData();
    },
};
</script>