Javascript 另一个v-for道具更新问题

：键已设置，前置函数正确执行作业，但v-for未更新。在Vue控制台中，对象“posts”已正确更新。 我真的不明白为什么v-for不听修改

<template>

    <div>

        <post-form v-on:newpost="prepend($event)"></post-form>

        <div id="posts" class="pt-4">

            <div v-for="post in posts" :key="post.id" class="alert" :class="alertClass(post.type_id)">
                {{ post.body }}
                <small>{{ post.user.name }} {{ post.updated_at | fromNow }}</small>
            </div>

        </div>

    </div>

</template>

<script>

    export default {
        props:['posts'],
        methods: {
            alertClass(type) {
                switch(type) {
                  case 1:
                    return "alert-secondary";
                    break;
                  case 2:
                    return "alert-success";
                    break;
                  case 3:
                    return "alert-danger";
                    break;
                  case 4:
                    return "alert-warning";
                    break;
                  case 5:
                    return "alert-info";
                    break;
                  default:
                    return "alert-light";
                }
            },
            prepend(event) {
                this.posts.unshift(event);
            }
        },
        filters: {
          fromNow: function (date) {
            return moment(date).fromNow();
          }
        }
    }
</script>

---

我在其他类似的线程中找不到awnser，很抱歉，如果它是重复的，

post.id

的值是多少，你能提供示例

posts[]

数据吗？@SajibKhan我用posts[]中的数据示例编辑了这篇文章，

post.id

的值是多少，你能提供示例

posts[]

data？@SajibKhan我用posts[]中的数据示例编辑了这篇文章

[
 {
  body: "dsf",
  created_at: "2019-02-15 08:55:16",
  deleted_at: null,
  id: 19,
  type_id: 1,
  updated_at: "2019-02-15 08:55:16",
  user: Object,
  user_id: 3
 }
]