title: How to parse json in Vue js to use it in template
body: <pre><code>&lt;template&gt;
      &lt;div class=&quot;row w-20 &quot; &gt;
          &lt;div class=&quot;card col-4 &quot;&gt;
               &lt;ul&gt;
                  &lt;li v-for=&quot;message in conversations.messages&quot; :key=&quot;message.messages&quot;&gt;
                      {{message.text}}  
                  &lt;/li&gt;        
              &lt;/ul&gt; 
              
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  export default {
      
      props: ['conversation_index_route'],
      data() {
          return {
              conversations: [],
              url: 'http://127.0.0.1:8000/comms/conversation/',
              
          }
      },
      beforeMount() {
          this.$eventBus.$on('selectConversation', this.getConversations)
          this.getConversations();
      },
      methods: {
          getConversations(id) {
              console.log(this.url+id);
              axios.get(this.url+ id)
                  .then(response =&gt; {
                      this.conversations = response.data;
                      this.conversations = JSON.parse(this.conversations.message);
                      console.log(this.conversations);
  
                  });            
          }
      }
  
  }
  &lt;/script&gt;
  </code></pre>
  <pre><code>conversation_index_route:&quot;http://127.0.0.1:8000/comms/conversation&quot;
  conversations:Object
  all_staff_attended:false
  centre_id:5
  children:&quot;&quot;
  classes:&quot;&quot;
  cover_image:&quot;https://via.placeholder.com/150x150&quot;
  created_at:&quot;2020-05-30 19:01:59&quot;
  exited_users:null
  id:257
  last_id:null
  messages:Array[1]
    0:&quot;{&quot;_id&quot;:1854,&quot;text&quot;:&quot;This is the beginning of this conversation&quot;,&quot;createdAt&quot;:&quot;2020-05-30 19:01:59&quot;,&quot;system&quot;:true}&quot;
  parent_users:&quot;3016&quot;
  parents:Array[1]
  staff_users:&quot;180,181&quot;
  staffs:Array[2]
  status_id:1
  title:&quot;Test&quot;
  updated_at:&quot;2020-05-30 19:01:59&quot;
  url:&quot;http://127.0.0.1:8000/comms/conversation/&quot;
  </code></pre>
  <p><a href="https://i.stack.imgur.com/COqFj.png" rel="noreferrer"><img src="https://i.stack.imgur.com/COqFj.png" alt="This is the data I got and want to parse the message array" /></a></p>
  <p>So what shall I code to use the message text in my template to display the text messages?</p>