vue上拉加载更多，本地数组

1. 本地创建一个数组
2. 实现上拉加载时，数组一部分一部分加载，知道没有

js部分

<script src="https://unpkg.com/vue/dist/vue.js"></script>
<script>
  new Vue({
    el: '#app',
    data: {
      datas: [{
          "page": 1,
          "items": [{
            "title": "1. 妊娠合并2019新型冠状病毒肺炎1例",
            "name": "赵瑞红等人",
            "time": "网络首发时间：2020-02-11 10:57"
          }, {
            "title": "2. 预防新型冠状病毒肺炎宣传手册",
            "name": "石岩等人",
            "time": "网络首发时间：2020-02-11 10:50；"
          }, {
            "title": "3. 新型冠状病毒肺炎疫情下治疗药物监测实验室的感染防控策",
            "name": "周红等人，",
            "time": "网络首发时间：2020-02-11 10:17；"
          }]
        },
        {
          "page": 2,
          "items": [{
            "title": "11. 妊娠合并2019新型冠状病毒肺炎1例",
            "name": "赵瑞红等人",
            "time": "网络首发时间：2020-02-11 10:57"
          }, {
            "title": "2. 预防新型冠状病毒肺炎宣传手册",
            "name": "石岩等人",
            "time": "网络首发时间：2020-02-11 10:50；"
          }, {
            "title": "3. 新型冠状病毒肺炎疫情下治疗药物监测实验室的感染防控策",
            "name": "周红等人，",
            "time": "网络首发时间：2020-02-11 10:17；"
          }]
        },
        {
          "page": 3,
          "items": [{
            "title": "13. 妊娠合并2019新型冠状病毒肺炎1例",
            "name": "赵瑞红等人",
            "time": "网络首发时间：2020-02-11 10:57"
          }, {
            "title": "2. 预防新型冠状病毒肺炎宣传手册",
            "name": "石岩等人",
            "time": "网络首发时间：2020-02-11 10:50；"
          }, {
            "title": "3. 新型冠状病毒肺炎疫情下治疗药物监测实验室的感染防控策",
            "name": "周红等人，",
            "time": "网络首发时间：2020-02-11 10:17；"
          }]
        }, {
          "page": 4,
          "items": [{
            "title": "14. 妊娠合并2019新型冠状病毒肺炎1例",
            "name": "赵瑞红等人",
            "time": "网络首发时间：2020-02-11 10:57"
          }, {
            "title": "2. 预防新型冠状病毒肺炎宣传手册",
            "name": "石岩等人",
            "time": "网络首发时间：2020-02-11 10:50；"
          }]
        }
      ],
      list: [],
      listpage: 0,
      logStatus: 2
    },

    created() {
      this.list = this.datas[0]['items']
      window.addEventListener('scroll', this.onScroll);
    },

    methods: {
      onScroll() {
        // 整个数据的长度
        let datasLength = this.datas.length;

        if (datasLength > 1) {
          this.logStatus = 0
          //可滚动容器的高度
          let innerHeight = document.querySelector('#app').clientHeight;
          //屏幕尺寸高度
          let outerHeight = document.documentElement.clientHeight;
          //可滚动容器超出当前窗口显示范围的高度
          let scrollTop = document.documentElement.scrollTop;
          //scrollTop在页面为滚动时为0，开始滚动后，慢慢增加，滚动到页面底部时，出现innerHeight < (outerHeight + scrollTop)的情况，严格来讲，是接近底部。
          console.log(innerHeight + " " + outerHeight + " " + scrollTop);

          if (outerHeight + scrollTop === innerHeight) {
            

            //加载更多操作
            // 新数组
            let newArr = []
            // 判断是否只有一组数据
            for (let i = 0; i < datasLength; i++) {
              if (this.listpage == i) {
                this.listpage+=1
                let newData = this.datas[this.listpage].items
                console.log(newData)
                for (let j = 0; j < newData.length; j++) {
                  console.log(newData[j])
                  this.list.push(newData[j])
                }
                break
              }
              console.log(i,this.listpage)
              if(this.listpage==(datasLength-1)){
                this.logStatus=2
              }
            }
            console.log(this.list)
          }
        }
      }
    }
  })
</script>

分享给大家个思路，希望对大家有些帮助；
有什么问题可以留言交流，多多提升进步，谢谢！