VUEJS 收到服务器的值后给数组赋值？

Question

服务器上接收的数据为[{ "name":"TOM" , "age":"16" },{ "name":"JACK" , "age":"18" },{ "name":"marry" , "age":"20" }]
我觉得是html中的循环代码有问题，请问哪里出错了？

<ul v-for="item in items">
<li>{{ item.name }}</li>
<li>{{ item.age }}</li>
</ul>

export default {
    data () {
      return {
        header:'',
        items: [
          {
            name:'',
            age:''
          }
        ]
      }
    },
    methods:{
      postdata(){
        var user_id = this.getcookies('user_id');
        this.$http.post('http://example.com/user',{
            userID:user_id
        }).then(function(data){
            this.items=data.body.data
        }
        )
      }
    }
  }

Answer 1

循环没问题啊，this.items拿到的是错的啊。属于this指向问题，你并没有成功赋值呢

this.$http.post('http://example.com/user',{
            userID:user_id
        }).then((data)=>{//这里用箭头函数
            this.items=data.body.data//this指向Vue实例了
        }
        )

Answer 2

<li v-for="v in items">

<p>{{v.name}}</p>
<p>{{v.age}}</p>

</li>

Answer 3

应该是this的指向问题，var self = this;

Answer 4

this的作用域问题 .then((res) => {})这样写