[Vuejs]-How to display following values in vuejs?

by

0👍

✅

Your given data is not complete. If given data is posts response use posts.data instead just posts

var vm = new Vue({
  el: '#vue-instance',
  data: {
    posts:{"status":true,"data":[{"ref_id":"22","agent_id":"68","p_id":"84","description":"i am interested"},{"ref_id":"24","agent_id":"68","p_id":"84","description":"For more information about Bootstrap and Bootstrap Glyphicons, visit our Bootstrap Tutorial.For more information about Bootstrap and Bootstrap Glyphicons, visit our Bootstrap Tutorial"}]
    },
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.16/vue.js"></script>
<div id="vue-instance">
 <table >
 <tbody>
    <tr v-for="post in posts.data">
      <th >Ref Id</th>
      <th >Agent Id</th>
      <th >PID</th>
     </tr>
     <tr v-for="post in posts.data">
      <td>{{ post.ref_id }}</td>
      <td>{{ post.agent_id }}</td>
      <td>{{ post.p_id }}</td>
     </tr>
</tbody>
</table>
</div>

Leave a comment