vue手机端下拉加载数据

直接使用@scroll="handscroll($event)"绑定事件可以对屏幕滑动进行监听

<template>
    <div >
        <main @scroll="handscroll($event)">
            <header  style="width:100%">
                <section>
                    <img width="33px" height="33px" src="@/assets/titile/yousmall.png" alt="">
                </section>
                <p>神秘人推理社（南坪万达店）</p>
            </header>
             <nav> 
               <p>生成微信群消息</p>
                <section>
                    <input type="text" v-model="queryselect.keyWords" placeholder="输入剧本名称">
                    <i class="icon iconfont" @click="handquerselect">&#xe612;</i>
                </section>
             </nav>
        <div v-for="(item,index) in form" :key="index">
            <div class="item" >
                <div class="item-left">
                    <img  width="85px" height="85px" :src="item.scriptUrl" alt="">
                </div>
                <div class="item-right">
                    <h2><span>{{item.scriptName}}</span> <span>￥{{item.originalPrice}}元</span> </h2>
                    <h3>{{item.businessName}}</h3>
                    <section>
                        <span>{{item.address}}</span>
                        <span>{{item.gameDate}}</span>
                    </section>
                    <h4 >
                        <span v-for="(ite,idx) in item.lableList" :key="idx">{{ite.labelContent}}</span>
                    </h4>
                <aside>
                        <p><van-icon name="underway-o" />{{item.gameTimeLong}}小时</p>
                        <p><van-icon name="user-o" />{{item.havePeople+'/'+item.needPeople}}人</p>
                    </aside> 
                </div>
                
            </div>
            <div class="item-line" ></div>
        </div>
            <div v-if="shows" class="pading-bttwon">
               我是有底线的
            </div>
          </main>
    </div>
</template>

滑动监听直接发请求改变渲染数据包就完事自己写判断就行。if（e.srcElement.scrollTop + e.srcElement.offsetHeight >= e.srcElement.scrollHeight）这里就是屏幕滑动到了最底判断是否改变num值发请求。

          //滚动分页加载数据
            handscroll(e) {
                // console.log(e)
                if(e.srcElement.scrollTop + e.srcElement.offsetHeight >= e.srcElement.scrollHeight){
                          this.queryselect.pageNum = this.queryselect.pageNum + 1;//每次分页+1\
                          console.log("到底了",this.queryselect.pageNum )
                          pageList(this.queryselect).then(res=>{
                            console.log("这是leght的长度",res.data.data.length)
                            if(res.data.data.length > 0){      //必须数据包里有数据才追加
                            this.form.push(...res.data.data); //追加数据 使用 ...语法
                              console.log("追加数据了")
                        }else{
                           this.shows=true
						  console.log("没有更多了")
                        }
                    })
                }
            }