title: How to automatically update vue component when data changed without refresh page
body: <p>I have fetched data by using axios. But it seems like vue component doesn’t update after click event and when the data changed. So I have to refresh the page in order to update data on the page. Do you have any simple way to solve this problem?</p>
  
  <p>This is the code from template.</p>
  
  <pre><code>&lt;template&gt;
    &lt;div class="container"&gt;
      &lt;h1&gt;Latest Posts&lt;/h1&gt;
      &lt;div class="create-post"&gt;
          &lt;label for="create-post"&gt;Add new post...&lt;/label&gt;
          &lt;input type="text" id="create-post" v-model="text" placeholder="Create a post"&gt;
          &lt;button v-on:click="createPost"&gt;Post!&lt;/button&gt;
      &lt;/div&gt;
  
      &lt;hr&gt;
  
      &lt;p class="error" v-if="error"&gt;{{ error }}&lt;/p&gt;
  
      &lt;div class="posts-container"&gt;
        &lt;div class="post" v-for="(post, index) in posts" v-bind:item="post" v-bind:index="index" v-bind:key="post._id"&gt;
          {{`${post.createdAt.getDate()}/${post.createdAt.getMonth()}/${post.createdAt.getFullYear()}`}}
          &lt;p class="text" id="example"&gt;{{post.text}}&lt;/p&gt;
        &lt;/div&gt;
      &lt;/div&gt;
  
    &lt;/div&gt;
  &lt;/template&gt;
  </code></pre>
  
  <p>This is the code from script</p>
  
  <pre><code>
  &lt;script&gt;
  import PostService from '../PostService';
  
  export default {
    name: 'PostComponent',
    data() {
      return {
        posts: [],
        error: '',
        text: ''
      }
    },
      computed: {
        postText: function() {
          return this.post.text
        }
      },
      watch: {
  
      },
    async created() {
      try {
        this.posts = await PostService.getPosts();
        console.log(this.$el.textContent) 
      } catch(err) {
        this.error = err.message;
      }
    },
    methods: {
      async createPost() {
        await PostService.insertPost(this.text);
        this.post = await PostService.getPosts();
      }
    }
  }
  &lt;/script&gt;
  
  </code></pre>