v-for not being called when updating array from inside method in Vue.js

Question

Had to resubmit this question as someone incorrectly closed it. Anyhow I am stuck on an issue with the view not updating when I update an array.

I have the following html

<div class="wall" id="wall">
      <div v-for="item in tweet_data" :key="item.id" class="tweet-box">
          // More code here
      </div>
</div>

and my vue code looks like the following

var main_twitter_feed = new Vue({
  el: '#wall',
  data: {
    tweet_data: []
  },
  methods: {
    fetch_latest_twitter_feed: function() {
      fetch('/api/fetch-main-twitter-feed').then(function(response) {
        if (response.status !== 200) {
          console.log('Looks like there was a problem. Status Code: ' + response.status);
          return;
        }
        // Examine the text in the response
        response.json().then(function(data) {
          if (data.hasOwnProperty('data')) {
            this.tweet_data = data.data
            console.log(this.tweet_data);
          }
        });
      }).catch(function(err) {
        console.log('Fetch Error :-S', err);
      });
      //    
    }
  }
})

When I call the method the "tweet_data" gets updated but this does not update the v-for inside the view. However before I moved the fetch_latest_twitter_feed() inside the vue methods I was calling it outside more like a traditional function

function fetch_latest_twitter_feed() {
  fetch('/api/fetch-main-twitter-feed').then(function(response) {
    if (response.status !== 200) {
      console.log('Looks like there was a problem. Status Code: ' + response.status);
      return;
    }
    // Examine the text in the response
    response.json().then(function(data) {
      console.log(data);
      if (data.hasOwnProperty('data')) {
        main_twitter_feed.tweet_data = data.data
      }
    });
  }).catch(function(err) {
    console.log('Fetch Error :-S', err);
  });
}

and the v-for updated without a problem. Can someone please help and explain the difference. I can't see why moving the function inside of the methods section would alter how the v-for reacts. I call it using the following

window.addEventListener('load', function() {
  main_twitter_feed.fetch_latest_twitter_feed();
  //const interval = setInterval(function() {
  //   fetch_latest_twitter_feed();
  //}, 2000);
})

Edit

I have now used

created() { this.fetch_latest_twitter_feed(); }

and removed the addEventListener but it still does not update the v-for

Thanks