浅谈element中InfiniteScroll按需引入的一点注意事项


Posted in Javascript onJune 05, 2020

大家为了节省空间,常常进行按需引入来节省空间,这里我给大家来介绍一下element中按需引入无限滚动指令注意的事项。

针对前面element 按需引入的一些配置这里就不再详细介绍了。
那么这里讲的是在main.js写入以下代码。

import { InfiniteScroll } from 'element-ui';
Vue.use(InfiniteScroll)

好,这样引入、注册了,那么我们接下来做得事情就是在页面使用它。

<template>
 <ul class="infinite-list" v-infinite-scroll="load" style="overflow:auto">
  <li v-for="i in count" class="infinite-list-item">{{ i }}</li>
 </ul>
</template>

<script>
 export default {
  data () {
   return {
    count: 0
   }
  },
  methods: {
   load () {
    this.count += 2
   }
  }
 }
</script>

这里你们可能嘲讽我,为啥把代码复制过来,哈哈,这只是为了更加方便。这里注意的是一定要给容器加上overflow:auto或者overflow:hidden,

给容器加上滚动条,这样就不会报错。 

到此这篇关于浅谈element中InfiniteScroll按需引入的一点注意事项的文章就介绍到这了,更多相关element InfiniteScroll按需引入内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
事件模型在各浏览器中存在差异
Oct 20 Javascript
推荐40个非常优秀的jQuery插件和教程【系列三】
Nov 09 Javascript
把jQuery的类、插件封装成seajs的模块的方法
Mar 12 Javascript
浅谈jQuery中height与width
Jul 06 Javascript
详解参数传递四种形式
Jul 21 Javascript
四种参数传递的形式——URL,超链接,js,form表单
Jul 24 Javascript
JavaScript+CSS实现仿Mootools竖排弹性动画菜单效果
Oct 14 Javascript
js实现精确到毫秒的倒计时效果
Aug 05 Javascript
微信公众平台获取access_token的方法步骤
Mar 29 Javascript
JavaScript中this函数使用实例解析
Feb 21 Javascript
小程序中的箭头函数的具体使用
Jun 19 Javascript
正则表达式基础与常用验证表达式
Jun 16 Javascript
使用JavaScript实现网页秒表功能(含开始、暂停、继续、重置功能)
Jun 05 #Javascript
Node.js API详解之 dgram模块用法实例分析
Jun 05 #Javascript
taro 实现购物车逻辑的实例代码
Jun 05 #Javascript
Node.js API详解之 V8模块用法实例分析
Jun 05 #Javascript
Vue CLI4 Vue.config.js标准配置(最全注释)
Jun 05 #Javascript
使用Taro实现小程序商城的购物车功能模块的实例代码
Jun 05 #Javascript
Vue路由的模块自动化与统一加载实现
Jun 05 #Javascript
You might like
Bo-Blog专用的给Windows服务器的IIS Rewrite程序
2007/08/26 PHP
php中调用其他系统http接口的方法说明
2014/02/28 PHP
php中cookie实现二级域名可访问操作的方法
2014/11/11 PHP
PHP结合Jquery和ajax实现瀑布流特效
2016/01/07 PHP
PHP+AJAX 投票器功能
2017/11/11 PHP
PHP+MySQL高并发加锁事务处理问题解决方法
2018/04/30 PHP
PDO::errorInfo讲解
2019/01/28 PHP
laravel 判断查询数据库返回值的例子
2019/10/11 PHP
仿百度输入框智能提示的js代码
2013/08/22 Javascript
解析JSON对象与字符串之间的相互转换
2013/12/18 Javascript
javascript实现多栏闭合展开式广告位菜单效果实例
2015/08/05 Javascript
Bootstrap的基本应用要点浅析
2016/12/19 Javascript
简单实现bootstrap选项卡效果
2017/02/08 Javascript
JavaScript 判断对象中是否有某属性的常用方法
2018/06/14 Javascript
JavaScript设计模式之工厂模式和抽象工厂模式定义与用法分析
2018/07/26 Javascript
详解vue-cli+element-ui树形表格(多级表格折腾小计)
2019/04/17 Javascript
js实现类似iphone的网页滑屏解锁功能示例【附源码下载】
2019/06/10 Javascript
Python列表推导式的使用方法
2013/11/21 Python
Python字典及字典基本操作方法详解
2018/01/30 Python
python list多级排序知识点总结
2019/10/23 Python
python使用协程实现并发操作的方法详解
2019/12/27 Python
Pytorch 实现focal_loss 多类别和二分类示例
2020/01/14 Python
解决python 找不到module的问题
2020/02/12 Python
Python 批量读取文件中指定字符的实现
2020/03/06 Python
利用css3实现的简单的鼠标悬停按钮
2014/11/04 HTML / CSS
美国男装连锁零售商:Men’s Wearhouse
2016/10/14 全球购物
我看到了用指针调用函数的不同语法形式
2014/07/16 面试题
给水排水工程专业毕业生推荐信
2013/10/28 职场文书
经贸日语专业个人求职信
2013/12/13 职场文书
2014年百日安全生产活动总结
2014/05/04 职场文书
护理专业毕业生自荐信
2014/06/15 职场文书
2014年卫生保健工作总结
2014/12/08 职场文书
因工资原因离职的辞职信范文
2015/05/12 职场文书
在校大学生才艺比赛策划书怎么写?
2019/08/26 职场文书
创业计划书之网吧
2019/10/10 职场文书
高性能跳频抗干扰宽带自组网电台
2022/02/18 无线电