VUE仿链家网，分页时怎么从后台服务器获取数据，并展示在页面上。

Question

https://github.com/wangjianliqq/Lianjiawang

<v-pagination :total="total" :currentPage='current' v-on:pageChange="pageChange" class="sellBottom-fenye"></v-pagination>

<script>
import axios from 'axios'
import pagination from './Pagination.vue'
import imgUrl1 from '../house1.png'
import imgUrl2 from '../house2.png'
export default {
  name: 'ErshoufangDetail',
  data () {
    return {
      total: 150,
      pagingVolume: 10,
      current: 1,
      contentList: [
        {imgUrl: imgUrl1, title: '珠江路地铁 君临国际 精装修 采光好视野好', xiaoqu: '君临国际', peizhi: '| 1室1厅 | 52.7平米 | 北 | 其他 | 有电梯', louceng: '高楼层(共32层)2005年建板塔结合  -  ', daolu: '华侨路', guanzhu: '191人关注 / 共16次带看 / 一年前发布', subway: '近地铁', vr: 'VR房源', five: '房本满两年', haskey: '随时看房', totalPrice: '160', unitPrice: '单价31099元/平米', active1: false, active2: true, active3: true, active4: false},
        {imgUrl: imgUrl2, title: '新城市广场摩尔特区 1室1厅 156万', xiaoqu: '新城市广场', peizhi: '| 1室1厅 | 51.45平米 | 北 | 精装 | 有电梯', louceng: '中楼层(共12层)2005年建塔楼结合 -  ', daolu: '龙江', guanzhu: '2人关注 / 共0次带看 / 1个月以前发布', subway: '近地铁', vr: 'VR房源', five: '房本满两年', haskey: '随时看房', totalPrice: '156', unitPrice: '单价29602元/平米', active1: true, active2: true, active3: false, active4: false}
      ]
    }
  },
  methods: {
    pageChange: function (currentPage) {
      console.log(currentPage)
    },
    getPageInfo () {
      /// 地址为后台数据地址为后台数据地址为后台数据地址为后台数据地址为后台数据
      axios.get('http://47.110.132.127:9000/city/get')
        .then(function (res) {
          res = res.data
          if (res.ret && res.data) {
            const data = res.data
            this.total = data.total
            this.pagingVolume = data.pagingVolume
            this.current = data.current
            this.contentList = data.contentList /// 前后名字一样
          }
        }) /// 先接受json文件，然后返回函数
        .catch(function (error) {
          console.log(error)
        })
    }
  },
  mounted () {
    this.getPageInfo() /// 先写个钩子函数
  },
  components: {
    'v-pagination': pagination
  }
}
</script>