首页 > 其他分享 >Vue无线滚动不触发问题

Vue无线滚动不触发问题

时间:2023-10-24 22:55:11浏览次数:32  
标签:触发 Vue 滚动 高度 100vh 无线

Vue的v-infinite-scroll="load" 会无线触发  要定义实际高度和可视高度之间关系 设置style="overflow:auto;height:calc(100vh - 49px)"    100vh = 100% 

<div class="box"  style="overflow:auto;height:calc(100vh - 100px)">
        <div v-infinite-scroll="load" class="infinite-list" >
          <div v-for="(value, index) in listDate" class="infinite-list-item" :key="index">
            <el-card class="box-card" shadow="hover">
              <div class="essay-Title">{{value.essayTitle}}---{{index}}</div><br/>
            </el-card>
          </div>

        </div>
      </div>

 

标签:触发,Vue,滚动,高度,100vh,无线
From: https://www.cnblogs.com/kidzxy/p/17785949.html

相关文章

  • 转载 vue-cli5降级为vue-cli4
    vue-cli5降级为vue-cli41.启动命令行,运行npmconfigls-l,找到userconfig路径下的.npmrc文件进行删除;2.输入wherevue,把vuevue.cmd这两个文件删除;3.输入vue-V,会显示‘vue’不是内部或外部命令,也不是可运行的程序或批处理文件。4.运行npmunivue-cli-g;5.安装任意指定......
  • Vue
    Vue一套前端框架,免除原生JavaScript中的DOM操作,简化书写基于MVVM(Model-View-ViewModel)思想,实现数据的双向绑定,将编程的关注点放在数据上框架:是一个半成品软件,是一套可重用的、通用的、软件基础代码模型。基于框架进行开发,更加快捷,更加高效。<head></head>中引入官方......
  • 记录--vue3实现excel文件预览和打印
    这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助前言在前端开发中,有时候一些业务场景中,我们有需求要去实现excel的预览和打印功能,本文在vue3中如何实现Excel文件的预览和打印。预览excel关于实现excel文档在线预览的做法,一种方式是通过讲文档里的数据处理成......
  • 【全志R128开发经验分享】启用USB ADB以及无线ADB配置方法
    首先在FreeRTOS的环境下,选择r128_c906_pro:sourceenvsetup.shlunch_rtosr128s2_pro_c906USBADB的配置比较常规,注意以下几个驱动的勾选usbdevice驱动adbgadget驱动adbd应用运行menuconfig,选择对应的驱动以及软件包:mrtos_menuconfig配置好的图片如下图所示当选......
  • 多个vue项目共用组件
    本文主要介绍引入本地的自己写的组件。1.准备3个vue2项目  demo-common文件夹里是组件在demo1和demo2中都需要使用 2.在demo-common文件夹里新建index.js文件,跟package.json同级。在index.js文件里导出在其他项目里需要用到的组件 3.分别在demo1和demo2的终端里输入......
  • vue + element ui 树形半选传父级id给后台,回显实现
    1.vue2:  需要关联父子级:Html部分check-strictly="false"<el-tree:data="dataTree"highlight-currentshow-checkbox:check-strictly="false"node-key="id":props="defaultProps&......
  • Vue3中使用富文本编辑器
    在vue3中我们可以使用@wangeditor/editor、@wangeditor/editor-for-vue来实现其功能npm地址:https://www.npmjs.com/package/@wangeditor/editor-for-vue/v/5.1.12?activeTab=readme官网:Editor 1.安装pnpmadd@wangeditor/editor#或者npminstall@wangeditor/editor--save......
  • vue中activated
    vue组件在开了,关了,再开,created,mounted不会触发,activated会解决这个问题,给力。。。在Vue中,activated是组件生命周期函数之一,它会在组件被激活时调用。具体来说,当一个组件被插入到DOM中并且处于活动状态(例如,它是父组件的子组件),activated函数就会被调用。它通常用于执行一些操作......
  • vue移动鼠标在canvas上画不规则图形(整合别人的,增加了一些功能)
    1、draw_shape.js1/**2*绘制不规则多边形3*/45import{Message}from'element-ui'67exportfunctiondraw_test(cav,list){8//画布初始化9letctx=cav.getContext('2d')10ctx.strokeStyle='red'11......
  • vue运行中,常出错,是因为版本不一样,造成的
     这个是版本冲突造成的在package.json中添加 setNODE_OPTIONS=--openssl-legacy-provider  ......