JavaScript--接口返回数据写入表格

1.表格：

 <el-table
    :data="tableData"
    border
    style="width: 20%">

2.接口返回数据：{"2019-2": 69, "2019-3": 1573, "2019-4": 4}

3.

<script>
  export default {
    data() {
      return {
        tableData:[], //对应表格中的data
    }
  },
  created:function(){ 
    this.gettabledata()
  },
  methods: {
    gettabledata(){
      let listdata = []
      let i = 0
      let url = 'http://192.168.188.173/jenkins/getmonthdata'
      this.$http.get(url).then(function(res){
        let tmp = JSON.parse(res['bodyText']) //获取返回数据:{"2019-2": 69, "2019-3": 1573, "2019-4": 4}
        for(var key in tmp){
          var obj = {}
          obj.date = key
          obj.number = tmp[key]  
          listdata[i]=obj  //list中是字典[{"2019-2": 69},{"2019-3": 1573}]
          i++
        }
        this.tableData = listdata
        }
        )
    }
  }
}
</script>

1）created和mounted的区别（https://blog.csdn.net/xdnloveme/article/details/78035065）

created:在模板渲染成html前调用，即通常初始化某些属性值，然后再渲染成视图。

mounted:在模板渲染成html后调用，通常是初始化页面完成后，再对html的dom节点进行一些需要的操作。

2）this.$http.get(url).then(function(res)....

this.$http.get(url) 来发送请求

then()方法异步执行，就是当then()前面的方法执行完之后在执行then()里面的方法，这样就不会发生获取不到数据的问题