编程 Javascript

vue vantUI tab切换时 list组件不触发load事件的问题及解决方法

Posted in Javascript onFebruary 14, 2020

最近由于公司项目需要，用vue写了几个简单的页面。用到了vantUI

List 列表

瀑布流滚动加载，用于控制长列表的展示当列表即将滚动到底部时，会触发事件并加载更多列表项。

（页面加载完成后默认会自动加载一次，可以:immediate-check="false"

这样设置一下，页面加载完成后就不会自动加载一次了

）

vue vantUI tab切换时 list组件不触发load事件的问题及解决方法

看上去一切都很美好；但是tab进行切换的时候，list组件的load事件不会再次被触发！！！就是list组件做上拉加载只有在第一个tab会触发，切换后触底不会再次触发

解决办法：

初始化定义了list的加载状态

vue vantUI tab切换时 list组件不触发load事件的问题及解决方法

tab切换时；重新初始化一次就行了

vue vantUI tab切换时 list组件不触发load事件的问题及解决方法

这样就解决了tab切换list组件不能再次被触发的问题

总结

以上所述是小编给大家介绍的vue vantUI tab切换时 list组件不触发load事件的问题及解决方法，希望对大家有所帮助！

vue vantUI tab切换时 list组件不触发load事件的问题及解决方法

- Author -

雨天呐

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

javascript之ESC(第二类混淆)

May 06 Javascript

JavaScript怎么判断图片是否加载完成以便获取其尺寸

May 08 Javascript

js实现横向百叶窗效果网页切换动画效果的方法

Mar 02 Javascript

JS实现的简单图片切换功能示例【测试可用】

Feb 14 Javascript

Angular4学习笔记之新建项目的方法

Jul 18 Javascript

深入理解js 中async 函数的含义和用法

May 13 Javascript

vue-cli项目修改文件热重载失效的解决方法

Sep 19 Javascript

vue实现多个元素或多个组件之间动画效果

Sep 25 Javascript

对angularJs中controller控制器scope父子集作用域的实例讲解

Oct 08 Javascript

微信小程序页面间值传递的两种方法

Nov 26 Javascript

js实现中文实时时钟

Jan 15 Javascript

Vue实现附件上传功能

May 28 Javascript

node.js中npm包管理工具用法分析

Feb 14 #Javascript

vue-cli创建的项目中的gitHooks原理解析

Feb 14 #Javascript

基于vue的tab-list类目切换商品列表组件的示例代码

Feb 14 #Javascript

bootstrap-paginator服务器端分页使用方法详解

Feb 13 #Javascript

JavaScript实现Tab选项卡切换

Feb 13 #Javascript

Angular 多模块项目构建过程

Feb 13 #Javascript

小程序卡片切换效果组件wxCardSwiper的实现

Feb 13 #Javascript

You might like

JQuery 网站换肤功能实现代码

2009/11/02 Javascript

node中socket.io的事件使用详解

2014/12/15 Javascript

jQuery读取XML文件内容的方法

2015/03/09 Javascript

Bootstrap每天必学之前端开发框架

2015/11/19 Javascript

详解Angular.js的$q.defer()服务异步处理

2016/11/06 Javascript

获取select的value、text值的简单示例（jquery与javascript）

2016/12/07 Javascript

jquery中ajax请求后台数据成功后既不执行success也不执行error的完美解决方法

2017/12/24 jQuery

浅谈AngularJS中$http服务的简单用法

2018/05/15 Javascript

JavaScript模拟实现自由落体效果

2018/08/28 Javascript

微信小程序五子棋游戏AI实现方法【附demo源码下载】

2019/02/20 Javascript

微信小程序新手教程之页面打开数量限制

2019/03/03 Javascript

Javascript实现一朵从含苞到绽放的玫瑰

2019/03/30 Javascript

jquery.pager.js分页实现详解

2019/07/29 jQuery

详解Vuex下Store的模块化拆分实践

2019/07/31 Javascript

浅析Vue下的components模板使用及应用

2019/11/27 Javascript

JavaScript函数Call、Apply原理实例解析

2020/02/17 Javascript

基于JavaScript获取url参数2种方法

2020/04/17 Javascript

详解微信小程序入门从这里出发（登录注册、开发工具、文件及结构介绍）

2020/07/21 Javascript

[26:24]完美副总裁、DOTA2负责人蔡玮专访：电竞如人生

2014/09/11 DOTA

[52:08]DOTA2上海特级锦标赛主赛事日 - 3 败者组第三轮#2Fnatic VS OG第一局

2016/03/05 DOTA

[38:54]完美世界DOTA2联赛PWL S2 Rebirth vs LBZS 第一场 11.28

2020/12/01 DOTA

python3.x上post发送json数据

2018/03/04 Python

flask框架视图函数用法示例

2018/07/19 Python

python实现彩票系统

2020/06/28 Python

Python运维自动化之nginx配置文件对比操作示例

2018/08/29 Python

python退出命令是什么？详解python退出方法

2018/12/10 Python

实现Python3数组旋转的3种算法实例

2020/09/16 Python

HTML5 文件域+FileReader 分段读取文件并上传到服务器

2017/10/23 HTML / CSS

2019年Java 最常见的面试题

2016/10/19 面试题

挑战杯创业计划书的写作指南

2014/01/07 职场文书

工会趣味活动方案

2014/08/18 职场文书

优秀共产党员演讲稿

2014/09/04 职场文书

个人政风行风自查自纠报告

2014/10/21 职场文书

2016自主招生教师推荐信范文

2015/03/23 职场文书

cf战队宣传语

2015/07/13 职场文书

新娘婚礼答谢词

2015/09/29 职场文书