mint-ui中loadmore使用方法

template

<template>
  <div class="wrapper" ref="wrapper" :style="{height: wrapperHeight + 'px'}">
    <mt-loadmore 
      :top-method="loadTop" 
      :bottom-method="loadBottom" 
      :bottom-all-loaded="allLoaded" 
      @bottom-status-change="handleBottomChange" 
      ref="loadmore">
      <ul>
        <li v-for="(item,index) in dealerList" v-bind:key="index">
          <div class="body">
            <div class="dealerList">
              <DealerInfo :dealerInfo="item"></DealerInfo>
              <div class="UIactive displayFlex">
                <div class="dealerBtn"><a class="tel" :href="'tel://'+item.tel">立即拨打</a></div>
                <a class="dj" href="##">
                  <div class="dealerBtn dealerBtnActive">获取底价</div>
                </a>
              </div>
            </div>
          </div>
        </li>
      </ul>
    </mt-loadmore>
  </div>
</template>

style

.wrapper{
    overflow-y: scroll;
  }

js

import {Toast,Indicator,InfiniteScroll} from 'mint-ui'
mounted() {
      this.$nextTick(function () {
           this.wrapperHeight = document.documentElement.clientHeight - 
           this.$refs.wrapper.getBoundingClientRect().top;
           console.log(this.wrapperHeight)
      })
      this.getDealerList();
      this.getRelocation();

    },


最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容