编程 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 相关文章推荐

基于jquery的一个OutlookBar类，动态创建导航条

Nov 19 Javascript

JS 实现导航栏悬停效果(续2)

Sep 24 Javascript

ajax与302响应代码测试

Oct 23 Javascript

JavaScript 作用域链解析

Nov 13 Javascript

调试JavaScript中正则表达式中遇到的问题

Jan 27 Javascript

jQuery根据ID、CLASS、等获取对象的实例

Dec 04 Javascript

VUE开发一个图片轮播的组件示例代码

Mar 06 Javascript

AngularJS的脏检查深入分析

Apr 22 Javascript

浅谈jQuery框架Ajax常用选项

Jul 08 jQuery

Angular4 中内置指令的基本用法

Jul 31 Javascript

微信小程序下拉刷新及上拉加载原理解析

Nov 06 Javascript

JavaScript canvas绘制折线图

Feb 18 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

《魔兽争霸3：重制版》更新多项视觉效果调整

2020/05/04 魔兽争霸

PHP实现分页的一个示例

2006/10/09 PHP

CakePHP去除默认显示的标题及图标的方法

2008/10/22 PHP

php使用APC实现实时上传进度条功能

2015/10/26 PHP

php脚本守护进程原理与实现方法详解

2017/07/20 PHP

尽可能写"友好"的"Javascript"代码

2007/01/09 Javascript

使用JavaScript 实现的人脸检测

2015/03/24 Javascript

原生js实现的贪吃蛇网页版游戏完整实例

2015/05/18 Javascript

jQuery.ajax向后台传递数组问题的解决方法

2017/05/12 jQuery

详解webpack babel的配置

2018/01/09 Javascript

JS实现的JSON序列化操作简单示例

2018/07/02 Javascript

微信小程序实现底部导航

2018/11/05 Javascript

在Create React App中启用Sass和Less的方法示例

2019/01/16 Javascript

Javascript通过控制类名更改样式

2019/05/24 Javascript

浅谈vue中组件绑定事件时是否加.native

2019/11/09 Javascript

node.js中Buffer缓冲器的原理与使用方法分析

2019/11/23 Javascript

typescript配置alias的详细步骤

2020/08/12 Javascript

vue elementui tree 任意级别拖拽功能代码

2020/08/31 Javascript

解决vue项目 build之后资源文件找不到的问题

2020/09/12 Javascript

解决vue下载后台传过来的乱码流的问题

2020/12/05 Vue.js

vue 中this.$set 动态绑定数据的案例讲解

2021/01/29 Vue.js

Python的设计模式编程入门指南

2015/04/02 Python

python使用两种发邮件的方式smtp和outlook示例

2017/06/02 Python

使用PyInstaller将python转成可执行文件exe笔记

2018/05/26 Python

python之消除前缀重命名的方法

2018/10/21 Python

python实现多进程通信实例分析

2019/09/01 Python

详解Python实现进度条的4种方式

2020/01/15 Python

手把手教你如何用Pycharm2020.1.1配置远程连接的详细步骤

2020/08/07 Python

python遍历路径破解表单的示例

2020/11/21 Python

微软澳洲官方网站：Microsoft Australia

2017/01/10 全球购物

Desigual英国官网：在线购买原创服装

2018/03/09 全球购物

岗位职责的含义

2013/11/17 职场文书

小学中等生评语

2014/12/29 职场文书

领导参观欢迎词

2015/01/26 职场文书

2016情人节宣传语

2015/07/14 职场文书

2015年秋学期师德师风建设工作总结

2015/10/23 职场文书