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

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

在NVIDIA A100 GPU中使用DALI和新的硬件JPEG解码器快速加载数据
在NVIDIA A100 GPU中使用DALI和新的硬件JPEG解码器快速加载数据如今,最流行的拍照设备智能手机可以捕获高达4K UHD的图像(3840×2160图像),原始数据超过25 MB.即使 ...
hive 如果表不存在则创建_从零开始学习大数据系列(四十七) Hive中数据的加载与导出...
[本文大约1400字,阅读时间5~10分钟] 在<从零开始学习大数据系列(三十八) Hive中的数据库和表>和<从零开始学习大数据系列(四十二)Hive中的分区>文章中,我们已 ...
如何在App中实现朋友圈功能之六快速实现下拉加载朋友圈功能——箭扣科技Arrownock
如何在App中实现朋友圈功能之六快速实现下拉加载朋友圈功能实现逻辑: 根据上次下拉刷新的时间从数据库加载出limit(比如10)条post,判断总数据条数: a. 如果总数据大于limit条,清 ...
Cesium中地形数据的加载
在cesium中为了看到更真实的世界,加载地形数据是必不可少的. 有地形数据和没有地形数据进行比较,就会一目了然了. 说明:1.地形数据是无法单独展示的,地形数据需要结合影像图或者普通瓦片来展示才能看 ...
Java中的类加载器（ClassLoader）及类的加载机制
类加载器就是用来将class文件加载到内存中的一个java类! 系统默认有三个类加载器! ①BootStrap:这不是java类,是java虚拟机在启动的时候加载的第一个类,这个加载器用来加载核心类, ...
el-table loading 显示暂无数据查询时显示数据正在加载中
<el-table v-loading="loadingShow" element-loading-text="数据正在加载中..."此处省略好几行> ...
【看板】ajax动态获取后台传来json数据，加载到页面表格中
ajax动态获取后台传来json数据,加载到页面表格中摘要 1.WebApi 2.看板HTML 3.ajax获取后台传来的数据:在这里要注意声明提升,所以需要在for循环外var str1 = &q ...
蜡炬教育：如何处理机器学习中大型数据的加载问题？
原标题:蜡炬教育:如何处理机器学习中大型数据的加载问题? 蜡炬教育老师表示,在处理机器学习算法时,经常会因为数据库太大而导致无法放入内存中,而遇到这样几个问题:当运行数据集算法而导致崩溃时如何解决?当 ...
Mint UI组件快速上手，在项目中使用mint UI
一.Mint UI是什么 Mint UI 是饿了么团队开源的一款基于 Vue.js 的移动端组件库 Bootstrap「它是 Twitter 开源的一个 css/html 工具包」二.引入 Mint ...

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

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

最新文章

热门文章