vue中利用scroll+js实现一个下拉刷新的功能

 

<div class="page" ref="scroll">//用scroll把想要滚动的地方包裹起来
    <div class="wrap">         //这个是被包裹的盒子
        <div class="refresh">  //显示出来的刷新页面
            //这里用了vant里面的刷新图标
//
            <van-icon :name="iconName" :class="{active:canRefresh,rotate:iconName === 'replay'}"/>
            //请求刷新的文本
            <span>{
  {refreshText}}</span>
        </div>
        <div class="main">
            <p>页面的主要内容</p>
        </div>
    </div>
</div>

export default {
    //数据的初始状态
    data(){
        return{
            canRefresh:false,                
            refreshText:"下拉可以刷新...",    
            iconName:"arror-down"
        }
    },
    mounted(){
    //构建滚动视图
    let scrol