title: vue reactivity not working until something in the dom updates
body: <p>I don't know how to describe this correctly, as I've just begun learning Vue. However I've come across quite a strange bug(at least I think so.) as the reactivity won't work.</p>
  
  <p>The objects are registered (pulled in with axios) but isn't shown until I change something in the one of the registered objects, in this case a input field bound to a vue model. I've checked for other posts describing this issue, but can't come across any.</p>
  
  <p>This is what spits out the messages:</p>
  
  <pre><code>&lt;li v-for="message in currentConversation.messages"&gt;{{ message.body }}&lt;/li&gt;
  </code></pre>
  
  <p>And this is what is setting/getting the messages:</p>
  
  <pre><code>axios
      .get("/api/messenger/conversation/messages/" + conversation.id)
      .then(response =&gt; {
        this.currentConversation.messages = response.data.reverse();
      })
      .catch(e =&gt; {
        console.log(e);
      });
  
    if (window.Echo) {
      this.listenForMessages(conversation.id);
    }
  </code></pre>
  
  <p>Anyone with similar experiences, who could point me in the right direction?
  Thanks!</p>