mint-ui 中 Infinite scroll 在tab-container中使用数据全部加载的问题

项目中用到了Infinite scroll 这个组件，但是初始化的时候，getList总会请求两次，

网上查了部分资料，如

<ul class="mui-table-view " v-infinite-scroll="getList"
			    infinite-scroll-disabled="loading" 
			    infinite-scroll-distance="0">

中的v-infinite-scroll等指令要放在ul标签上，ul 的父标签必须加固定高度，ajax获取成功后加上setTime渲染，经测试，均为生效，后来看到官方api，还有一个infinite-scroll-immediate-check的属性，默认为true,再次更改为false，初始化就不会请求两次接口了；

 

但是此方法在和mint-ui 中的tab-container结合使用时，getList会出现一直调用，直到所有的数据都加载完毕，想着应该是窗体切换时，公用同一个窗体高度造成的；

因为在tab-container中的mt-tab-container-item 增加v-if 即可；经验证此方式可行。

<mt-tab-container v-model="active">
  <mt-tab-container-item id="tab-container1"  v-if=“active == ‘tab-container1’ ”>
    <mt-cell v-for="n in 10" title="tab-container 1"></mt-cell>
  </mt-tab-container-item>
  <mt-tab-container-item id="tab-container2">
    <mt-cell v-for="n in 5" title="tab-container 2"></mt-cell>
  </mt-tab-container-item>
  <mt-tab-container-item id="tab-container3">
    <mt-cell v-for="n in 7" title="tab-container 3"></mt-cell>
  </mt-tab-container-item>
</mt-tab-container>

 

 

 

转载于:https://www.cnblogs.com/suiyide/p/9772050.html