Vue.js 数据 : undefined

Question

我是 Vue.js 的新手。

请多多指教。
我收到 comments: undefined 所以评论没有显示。 xhr带200是正常的。

谢谢 谢谢 谢谢 谢谢 谢谢

<template>
 <div>
  <ul class="media-list">
     <li class="media" v-for="comment in comments">
         {{ $comment.body }}            
     </li>
  </ul> 
</div>
</template>


<script>
 export default {
    data () {
        return {
            comments: []
        }
    },
    props: {
        postid: null
    },
    methods: {
        getComments () {
            this.$http.get('/blog/' + this.postid + '/comments').then((response) => {
                this.comments = response.json().data;
            });
        }
    },
    mounted () {
        this.getComments();
    }
}

Answer 1

基本上有两个问题:

1. $comment不存在
2. 您在 response.json().data 上没有数据，这就是您得到 undefined 的原因

我使用不同的 API 只是为了测试它(因为我无权访问您的 API)。

模板

<div id="app">
  <ul class="media-list">
    <li class="media" v-for="comment in comments">
      {{ comment.familyName + ', ' + comment.givenName }}
    </li>
  </ul>
</div>

脚本

new Vue({
    el: '#app',
  data () {
    return {
      comments: []
    }
  },
  props: {
    postid: null
  },
  methods: {
    getComments () {
      this.$http.get('//ergast.com/api/f1/drivers.json').then((response) => {
        this.comments = response.body.MRData.DriverTable.Drivers;
      });
    }
  },
  mounted () {
    this.getComments();
  }
});

查看工作示例 here