业务逻辑涉及loadmore,filter和tab切换,框架是vue,使用vue-infinite-loading中的一点经历。
identifier 一开始并没有重视这个参数,只是他的官网说identifier适用tab切换,filter。但因为初次使用一开始并没有使用,导致遇到很多坑。
坑主要集中在,切换状态后infinite组件并没有刷新数据,一开始做的逻辑是 组件使用v-show控制状态,mouted加载数据,然后infinite组件做loadmore,
之后有改成v-if控制组件重启加载,这也只是解决了一部分bug,但是还是有问题,因为状态切换的初始数据需要单独做,当v-if加载infinite组件,导致会加载重复数据,
最后才使用identifier属性,因为infinite放在一个组件中,所以identifier数据需要computed监听否则,props的数据并没有更新。
还有就是 tab切换的时候需要把infinite的数据清空,否则会不能触发加载,如果高度够的话

vue-infinite-loading 过滤器tab正确使用的更多相关文章

  1. vue教程2-06 过滤器

    vue教程2-06 过滤器 过滤器: vue提供过滤器: capitalize uppercase currency.... <div id="box"> {{msg| ...

  2. vue打包后显示空白正确处理方法

    vue打包后显示空白正确处理方法是 1.找到配置文件(js与css加载不上) 修改 这样打包处理可以打开但是页面样式会找不到 2.修改(针对css中的图片加载不上) 找到对应的位置加上publicPa ...

  3. Vue学习之过滤器和自定义指令小结(三)

    过滤器: 过滤是一个数据经过了这个过滤之后出来另一样东西,可以是从中取得你想要的,或者给那个数据添加点什么装饰.过滤器就是过滤用的工具.渲染数据用的!!! 我们需要知道的是: 1.Vue中的过滤器不能 ...

  4. 黑马vue---28、vue中全局过滤器的基本使用

    黑马vue---28.vue中全局过滤器的基本使用 一.总结 一句话总结: vue中的过滤器可以传递参数(根据参数来过滤),也可以用管道符拼接多个过滤器:例如<p>{{ msg | msg ...

  5. 第二章 Vue快速入门-- 24 过滤器-Vue中全局过滤器的基本使用

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...

  6. Vue 中的过滤器的使用

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. vue.js之过滤器,自定义指令,自定义键盘信息以及监听数据变化

    一.监听数据变化 1.监听数据变化有两种,深度和浅度,形式如下: vm.$watch(name,fnCb); //浅度 vm.$watch(name,fnCb,{deep:true}); //深度监视 ...

  8. vue 日期时间过滤器

    来自:https://blog.csdn.net/m0_37068028/article/details/72898154 侵删 来自:https://segmentfault.com/a/11900 ...

  9. vue学习目录 vue初识 this指向问题 vue组件传值 过滤器 钩子函数 路由 全家桶 脚手架 vuecli element-ui axios bus

    vue学习目录 vue学习目录 Vue学习一之vue初识 Vue学习二之vue结合项目简单使用.this指向问题 Vue学习三之vue组件 Vue学习四之过滤器.钩子函数.路由.全家桶等 Vue学习之 ...

随机推荐

  1. Win2008 远程时提示"要登录到此远程计算机,您必须被授予允许通过终端登录登录的权限"的解决方法

    问题描述 ECS Windows 2008 远程登陆时提示"要登录到此远程计算机,您必须被授予允许通过终端登录登录的权限",如下图所示: 问题分析 组策略中做了设置不允许管理员组成 ...

  2. 阿里云Redis性能测试结果(1个集合存300万数据,查询能几秒返回结果)

    现状: 1.买了一台主从的阿里云Redis,内存就1GB. 2.查询了阿里云的帮助,没有找到性能相关的说明, 有的也是4GB版本的并发性能 3.提工单问客服 一个集合里有300万数据,单次查询性能大概 ...

  3. DLL/EXE查看工具Dumpbin

    一般情况下,我们需要查看一个DLL或EXE中的包含的函数或是依赖的函数之类的信息,可以使用VS自带的工具dumpbin: 可以直接在命令行下输入dumpbin就可以查看他的使用说明,如果未显示,可以先 ...

  4. OpenGL学习网址2

    http://www.opengpu.org/forum.php?mod=viewthread&tid=7525

  5. 曹工说Spring Boot源码(18)-- Spring AOP源码分析三部曲,终于快讲完了 (aop:config完整解析【下】)

    写在前面的话 相关背景及资源: 曹工说Spring Boot源码(1)-- Bean Definition到底是什么,附spring思维导图分享 曹工说Spring Boot源码(2)-- Bean ...

  6. Elasticsearch与中文分词配置

    一. elasticsearch on windows 1.下载地址: https://www.elastic.co/cn/downloads/elasticsearch 如果浏览器下载文件慢,建议使 ...

  7. Go语言实现:【剑指offer】对称的二叉树

    该题目来源于牛客网<剑指offer>专题. 请实现一个函数,用来判断一颗二叉树是不是对称的.注意,如果一个二叉树同此二叉树的镜像是同样的,定义其为对称的. Go语言实现: 方法一:递归 / ...

  8. [redis读书笔记] 第一部分 数据结构与对象 字典

    三 字典 字典是Hash对象的底层实现,比如用HSET创建一个HASH的对象,底层可能就是用一个字典实现的键值对. 字典的实现主要设计下面三个结构: /* * 哈希表节点 */ typedef str ...

  9. git学术

    点滴是为了生活,学术是为了未来.点滴经常看,学术用到的时候看看. #### git add 之后, git reset HEAD filename 和git checkout HEAD filenam ...

  10. 第三篇 SpringBoot整合log4j2详解

    源代码:https://pan.baidu.com/s/1d1Lwv1gIvVNltIKVWeEseA 提取码:wff0 SpringBoot整合Log4j2步骤: 1.删除spring-boot-s ...