vue2滚动条加载更多数据实现代码

<div class="questionList-content-list">   <ul>    <li v-for="item in questionListData" @click="goDetail(item.id)">     {{item.create_time}}     [{{item.level_value}}]    {{item.description}}     {{item.status_value}}    </li>   </ul>  </div>

created () {   var self = this   $(window).scroll(function () {    let scrollTop = $(this).scrollTop()    let scrollHeight = $(document).height()    let windowHeight = $(this).height()    if (scrollTop + windowHeight === scrollHeight) {     self.questionListData.push({      'id': '62564AED8A4FA7CCDBFBD0F9A11C97A8',      'type': '0102',      'type_value': '数据问题',      'description': '撒的划分空间撒电话费看见爱上对方见客户速度快解放哈萨克接电话发生的划分空间是的哈副科级哈师大空间划分可接受的后方可抠脚大汉房间卡收到货放假多少',      'status': '0',      'status_value': '未解决',      'level': '0203',      'level_value': '高',      'content': '过好几个号',      'userid': 'lxzx_hdsx',      'create_time': 1480296174000,      'images': null     })     self.questionListData.push({      'id': 'D679611152737E675984D7681BC94F16',      'type': '0101',      'type_value': '需求问题',      'description': 'a阿斯顿发生丰盛的范德萨范德萨发十多个非官方阿道夫葛根粉v跟下载v',      'status': '0',      'status_value': '未解决',      'level': '0203',      'level_value': '高',      'content': '秩序性支出V型从v',      'userid': 'lxzx_hdsx',      'create_time': 1480296155000,      'images': null     })     self.questionListData.push({      'id': 'B5C61D990F962570C34B8EE607CA1384',      'type': '0104',      'type_value': '页面问题',      'description': '回复的文本框和字体有点丑',      'status': '0',      'status_value': '未解决',      'level': '0203',      'level_value': '高',      'content': '回复的文本框和字体有点丑',      'userid': 'lxzx_hdsx',      'create_time': 1480064620000,      'images': null     })     self.questionListData.push({      'id': '279F9571CB8DC36F1DEA5C8773F1793C',      'type': '0103',      'type_value': '设计问题',      'description': '设计bug，不应该这样设计。',      'status': '0',      'status_value': '未解决',      'level': '0204',      'level_value': '非常高',      'content': '设计bug，不应该这样设计。你看。',      'userid': 'lxzx_hdsx',      'create_time': 1480064114000,      'images': null     })     self.questionListData.push({      'id': '80E365710CB9157DB24F08C8D2039473',      'type': '0102',      'type_value': '数据问题',      'description': '数据列表滚动条问题',      'status': '0',      'status_value': '未解决',      'level': '0202',      'level_value': '中',      'content': '数据列表在数据条数比较多的情况下无滚动条',      'userid': 'lxzx_hdsx',      'create_time': 1480034606000,      'images': null     })     console.log(self.questionListData)    }   })  },

<div id="content" style="height:960px" class="questionList-content-list"> 　　<ul> 　　　　<li class="list"> 　　　<span测试1</span>     <span>测试2</span>     <span>测试3</span>     <span>测试4</span>     <span>测试5</span>     <span>测试6</span>     <span>测试7</span>     <span>测试8</span>     <span>测试9</span>     <span>测试10</span>     <span>测试11</span>　　　　</li> 　　</ul> </div>

var html = ''       //距下边界长度/单位px  $(window).scroll(function () {   var scrollTop = $(this).scrollTop();   var scrollHeight = $(document).height();   var windowHeight = $(this).height();   if (scrollTop + windowHeight == scrollHeight) {    for(let i=0;i<10;i++){     html += '<li>Page: ' + i + ', Data Index: ' + i + ' </li>'    }    $('#content ul').append(html);   }  });