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

 更新时间:2020年06月05日 14:34:32   作者:Vam的金豆之路  
这篇文章主要介绍了浅谈element中InfiniteScroll按需引入的一点注意事项,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

大家为了节省空间,常常进行按需引入来节省空间,这里我给大家来介绍一下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按需引入内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • Vue3 Reactive响应式原理逻辑详解

    Vue3 Reactive响应式原理逻辑详解

    这篇文章主要介绍了Vue3 Reactive响应式原理逻辑详解,文章围绕主题展开详细的内容介绍,具有一定的参考价值,需要的小伙伴可以参考一下
    2022-07-07
  • daisyUI解决TailwindCSS堆砌class问题详解

    daisyUI解决TailwindCSS堆砌class问题详解

    这篇文章主要为大家介绍了daisyUI解决TailwindCSS堆砌class问题详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-07-07
  • vue使用动态添加路由(router.addRoutes)加载权限侧边栏的方式

    vue使用动态添加路由(router.addRoutes)加载权限侧边栏的方式

    这篇文章主要介绍了vue使用动态添加路由(router.addRoutes)加载权限侧边栏的方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-06-06
  • vue3+elementPlus二次封装表单的实现代码

    vue3+elementPlus二次封装表单的实现代码

    最近使用Vue3+ElementPlus开发项目,从整体上构思组件的封装。能写成组件的内容都进行封装,方便多个地方使用,这篇文章给大家介绍了vue3+elementPlus二次封装表单的实现,并通过代码介绍的非常详细,需要的朋友可以参考下
    2024-03-03
  • Vue项目中数据的深度监听或对象属性的监听实例

    Vue项目中数据的深度监听或对象属性的监听实例

    这篇文章主要介绍了Vue项目中数据的深度监听或对象属性的监听实例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-07-07
  • vue 实现滚动到底部翻页效果(pc端)

    vue 实现滚动到底部翻页效果(pc端)

    这篇文章主要介绍了pc端vue 滚动到底部翻页效果,本文通过实例代码给大家介绍的非常详细,具有一定的参考借鉴价值 ,需要的朋友可以参考下
    2019-07-07
  • 详解Vue computed计算属性是什么

    详解Vue computed计算属性是什么

    在vue中,有时候你需要对data中的数据进行处理,或者对抓取的数据进行处理之后再挂载呈现到标签中,这时候你就需要计算属性了,当然看到这里你可能还是不了解那下面我举几个实例并附代码解释
    2023-03-03
  • 在Vant的基础上实现添加表单验证框架的方法示例

    在Vant的基础上实现添加表单验证框架的方法示例

    这篇文章主要介绍了在Vant的基础上实现添加验证框架的方法示例,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-12-12
  • 渲染函数 & JSX详情

    渲染函数 & JSX详情

    本篇文章来讲解渲染函数 & JSX,Vue 推荐在绝大多数情况下使用模板来创建你的 HTML。然而在一些场景中,你真的需要 JavaScript 的完全编程的能力。这时我们可以用渲染函数,它比模板更接近编译器,需要的朋友可以参考一下
    2021-09-09
  • vue监听页面中的某个div的滚动事件并判断滚动的位置

    vue监听页面中的某个div的滚动事件并判断滚动的位置

    本文主要介绍了vue监听页面中的某个div的滚动事件并判断滚动的位置,文中通过示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-03-03

最新评论