title: Build a load more data button
body: <p>I’m currently building a blog and I’m trying to implement a load more button but I’m kinda stuck. Here is what I got :
  I have a list of posts from a REST API that I call in in my Vuex Store:</p>
  
  <pre><code>actions: {
     LOAD_ARTICLE_LIST: function ({ commit }) {
        axios.get('someurl/articles').then((response) =&gt; {
        commit('SET_ARTICLE_LIST', { list: response.data.data })
         }, (err) =&gt; {
         console.log(err)
         })
     }
  }
  mutations: {
    SET_ARTICLE_LIST: (state, {list}) =&gt; {
      state.articles = list
     }
  }
  </code></pre>
  
  <p>The simplified article component :</p>
  
  <pre><code>&lt;div v-for="article in articles"&gt;
    &lt;div&gt; {{ article.title }}&lt;/div&gt;
    &lt;div&gt; {{ article.description }}&lt;/div&gt;
    &lt;div&gt; {{ article.date }}&lt;/div&gt;
  &lt;/div&gt;
  &lt;div v-if="articles.length &gt; 4" @click="loadMore"&gt;
    &lt;div&gt;More articles&lt;/div&gt;
   &lt;/div&gt;
  
   computed: {
     articles() {
        function compare(a, b) {   //sort articles by date
          if (a.date &gt; b.date)
            return -1;
          if (a.date &lt; b.date)
            return 1;
          return 0;
        }
  
      let articleList = this.$store.state.articles.sort(compare);
      articleList.splice(0,5);
      return articleList
    }
   }
  
   mounted: function () {
     this.$store.dispatch('LOAD_ARTICLE_LIST')
   }
  </code></pre>
  
  <p>I know that I have to use the method calling loadMore(), and I think I have to push new articles in it but no idea how to do it. If someone could give me a hand, it would be so cool!</p>
  
  <p>Thank you for reading</p>
  
  <p>Note: if I push any articles with this method, will they be sorted by date with all the list or only with the new articles that I pushed?</p>