Vue数据绑定后渲染HTML

作为一个刚刚开始vue 的小菜鸟都不算的小菜鸟，真的是举步维艰啊，今天用axios获取json数据，已经console出数据，但是呢，就是不显示在页面上，经过各种查询，终于知道为什么，好吧，其实是我自己的问题

总结一下，希望以后吸取不好好学习的教训

vue数据绑定，先绑定数据，后渲染

引入vue,axios

<script src="https://cdn.bootcss.com/vue/2.2.2/vue.min.js"></script>

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

<div id="app">
    <ul>
        <li v-for="item in aboutData" :id="item.id">
            <div v-text="item.name></div>
            <div v-if="item.gender==1">女</div>
            <div v-else>男</div>
            <div href="" v-for="item1 in item.education">
               <div v-text="item1.time"></div>
               <div v-text="item1.school"></div>
            </div>
        </li>
    </ul>
</div>

//json数据
[{
    "name":"Tokyo",
    "id":"1",
    "gender":0,
    "education":[{
      "time":"2018年6月12日","school":"斯坦福"},{"time":"2015年6月","school":"北京理工"}]
  },{
  "name":"Tokyo",
  "id":"2",
  "gender":1,
  "education":[{
    "time":"2018年6月12日","school":"斯坦福"},{"time":"2015年6月","school":"北京理工"}]
}]

var vp=new Vue({
    el:"#app",
    data:{
        aboutData:[]
    },
    mounted(){
        this.showData();
        //需要执行的方法可以在mounted中，获取数据后，可以先进行渲染
    },
    methods:{
        showData(){
           axios.get("data.json").then(respinse =>{
               for(let i=0;i<respinse.data.length;i++){
                  vp.aboutData.push(response.data[i]);
               }
               console.log(vp.aboutData);
            }).catch(err=>{
                console.log(err);
            })
        }
    }
})