Javascript get data through methods

I have been trying to get these piece of code to work but I cannot find the right solution. Please can someone tell me why this works (loads data on load) but new records are not shown automatically.

<script>
Vue.component('comments',{
  template: '#comment-vue-template',
  data:() => {
    return {
        comments: []
        }
    },
  created: function(comments) {
    this.$http.get('/comments')
    .then(response => {
    this.comments = response.body
    });
    setTimeout(1000);
  },
  methods: {
    getComments: function(comments) {
      this.$http.get('/comments')
      then(response => {
        this.comments = response.body
      })
    },
  },
});
new Vue({
  el:'#app',
});
</script>

and this code below does not work at all :-

<script>
Vue.component('comments',{
  template: '#comment-vue-template',
  data:() => {
    return {
        comments: []
        }
    },
  created: function(comments) {
    this.getComments();
  },
  methods: {
    getComments: function(comments) {
      this.$http.get('/comments')
      then(response => {
        this.comments = response.body
      });
      setTimeout(this.getComments,1000);
    },
  },
});
new Vue({
  el:'#app',
});
</script>

Thanks in advance

via Aatish Kumar