I'm curious about why the newly added data isn't showing up in the template, even though it does appear when using console.log
(check out ViewPost.vue).
After adding a new post, this is the result: result.png. Does anyone know how to fix this?
My parent component looks like this:
<template>
<section>
//more codes here
<ViewPost v-for="data in postData" :key="data.post_id" :data="data" />
</section>
</template>
<script>
import { mapState } from 'vuex';
export default {
components: { ViewPost },
computed: {
...mapState({
postData: state => state.post.datas,
}),
}
//more codes here
};
</script>
Below is the content of ViewPost.vue:
<template>
<span>
<div class="card mb-10">
<h1>body</h1>
{{ data.post_body }}
</div>
</span>
</template>
<script>
export default {
props: {
data: {},
},
created() {
console.log(this.data);
},
};