实现Element Select选择器滚动加载
<template><el-selectpopper-class="more-tag-data"v-model="tagId"filterableplaceholder="请选择"@focus="focusTag"><el-optionv-for="(item, index) in taskTagLists":key="index":label="item.name":value="item.id"></el-option></el-select>
</template><script>
export default {data() {return {tagPage: {pageSize: 10,currentPage: 1,total: 0},taskTagLists: []}},created() {getTmpList({pageNum: this.tagPage.currentPage,pageSize: this.tagPage.pageSize}).then(res => {this.tagPage.total = res.data.totalthis.taskTagLists = res.data.list})},methods: {focusTag() {// 获取dom节点const domElementNode = document.querySelector('.more-tag-data .el-select-dropdown__wrap')// 注册下拉滚动事件domElementNode.addEventListener('scroll', ()=>{const isBottom = domElementNode.scrollHeight - domElementNode.scrollTop <= domElementNode.clientHeightif (isBottom) {this.loadMore()}})},loadMore() {if(this.tagPage.currentPage * this.tagPage.pageSize < this.tagPage.total) {this.tagPage.currentPage ++this.getTageValue()}},getTageValue() {getTmpList({pageNum: this.tagPage.currentPage,pageSize: this.tagPage.pageSize}).then(res => {this.taskTagLists = this.taskTagLists.concat(res.data.list)})}}
}
</script>
注意:
因为select组件在默认情况下是display:none的状态,所以不能把监听滚动事件放到mounted内,会获取不到元素class。
相关文章:

实现Element Select选择器滚动加载
<template><el-selectpopper-class"more-tag-data"v-model"tagId"filterableplaceholder"请选择"focus"focusTag"><el-optionv-for"(item, index) in taskTagLists":key"index":label"item.n…...
C++ 之 Vector 和 List
Vector vector 是C STL中最常用的容器,支持存储多种类型的数据。 与数组相比,它的大小是可变的,因此也会被称为动态数组。 使用它,需要包含头文件: #include <vector>定义的结构: vector<数据类…...

力扣-448.找到所有数组中消失的数字
Idea 模拟 class Solution { public:vector<int> findDisappearedNumbers(vector<int>& nums) {int n nums.size();vector<int> a(n 1, 0);for(int i : nums) a[i];vector<int> ans;for(int i 1; i < n; i) if(!a[i]) ans.emplace_back(i);r…...
常用gdb调试命令
常见gdb调试命令 命令名 命令缩写 命令说明 backtrace bt 查看函数调用堆栈 frame f 查看栈帧 list l 查看源码 print p 打印内部变量值 info i 查看程序状态 display disp 跟踪某变量,每次停下来则显示值 run r 开始运行程序 continue c 继续程序运行,直到下一个断…...
【动手学深度学习-Pytorch版】BERT预测系列——用于预测的BERT数据集
本小节的主要任务即是将wiki数据集转成BERT输入序列,具体的任务包括: 读取wiki数据集生成下一句预测任务的数据—>主要用于_get_nsp_data_from_paragraph函数从输入paragraph生成用于下一句预测的训练样本:_get_nsp_data_from_paragraph生…...

【数据结构-字符串 三】【栈的应用】字符串解码
废话不多说,喊一句号子鼓励自己:程序员永不失业,程序员走向架构!本篇Blog的主题是【字符串转换】,使用【字符串】这个基本的数据结构来实现,这个高频题的站点是:CodeTop,筛选条件为&…...

Stm32_标准库_10_TIM_显示时间日期
利用TIM计数耗费1s,启动中断,秒表加一 时间显示代码: #include "stm32f10x.h" // Device header #include "Delay.h" #include "OLED.h"uint16_t num 0; TIM_TimeBaseInitTypeDef TIM_TimeBaseInitStructure; NVIC_I…...

10-SRCNN-使用CNN实现超分辨成像
文章目录 utils_dataset.pymodel.pytrain.pyuse.py主要文件 utils_dataset.py 工具文件,主要用来制作dataset,便于加入dataloader,用于实现数据集的加载和并行读取 model.py 主要写入网络(模型) train.py 主要用于训练 use.py 加载训练好的模型,用于测试或使用 utils_dat…...
cmd/bat 输出符,控制台日志输出到文件
前言 略 输出符 A > B将A执行结果覆盖写入B A >> B将A执行结果追加写入B 常用句柄 句柄句柄的数字代号描述STDIN0键盘输入STDOUT1输出到命令提示符窗口STDERR2错误输出到命令提示符窗口 控制台日志输出到文件 1.bat 1>d:\log.log将控制台日志输出到文件 d:…...

ODrive移植keil(七)—— 插值算法和偏置校准
目录 一、角度读取1.1、硬件接线1.2、程序演示1.3、代码说明 二、锁相环和插值算法2.1、锁相环2.2、插值2.3、角度补偿 三、偏置校准3.1、硬件接线3.2、官方代码操作3.3、移植后的代码操作3.4、代码说明3.5、SimpleFOC的偏置校准对比 ODrive、VESC和SimpleFOC 教程链接汇总&…...

【肌电信号】OpenSignals使用方法 --- 肌电信号采集及导入matlab
一、 多通道采集教学 1. 数据线连接 将PLUX设备通过USB或蓝牙与电脑连接,注意确认在几号通道接线。 2.实时数据采集可视化 进行设置。需要在软件中选择你的PLUX设备,并配置相关的参数,如采样率、分辨率、信号类型等 3 支持数据回放和…...

STM32 多功能按键中断
key1 开关实现led1亮灭,key2开关实现蜂鸣器开关,key3开关实现风扇开关 main.c #include "uart.h" #include "key_it.h" #include "led.h" int main() {char c;char *s;uart4_init();//串口初始化all_led_init();key_it_config();fengshan_init…...

Linux-文件管理命令
绝对路径:从根目录开始描述的路径 pwd输入即为绝对路径, 开头一定是“/”,因为一定是从根目录开始走 相对路径:从当前路径开始描述的路径,开头不一定是“/”,因为不一定是从根目录开始走的 .:是当前目录 。…...

JS DataTable中导出PDF右侧列被截断的问题解决
JS DataTable中导出PDF右侧列被截断的问题解决 文章目录 JS DataTable中导出PDF右侧列被截断的问题解决一. 问题二. 解决办法三. 代码四. 参考资料 一. 问题 二. 解决办法 设置PDF大小和版型 orientation: landscape, pageSize: LEGAL,上述代码设置打印的PDF尺寸为LEGAL&…...

学习笔记-MongoDB(复制集,分片集集群搭建)
复制集群搭建 基本介绍 什么是复制集? 复制集是由一组拥有相同数据集的MongoDB实例做组成的集群。 复制集是一个集群,它是2台及2台以上的服务器组成,以及复制集成员包括Primary主节点,Secondary从节点和投票节点。 复制集提供了…...

Servlet与设计模式
1 过滤器和包装器 过滤器可以拦截请求及控制响应,而servlet对此毫无感知。过滤器有如下作用: 1)请求过滤器:完成安全检查、重新格式化请求首部或体、建立请求审计日志。 2)响应过滤器:压缩响应流、追加或…...

Python学习基础笔记六十五——布尔值
布尔对象: Python中有一种对象类型称之为布尔对象(英文叫bool)。 布尔对象只有两种取值,True和False。对应的是真和假,或者说是和否。True对应的是,False对应的是否。 我觉得这句话是一个关键:…...

ChatGPT生产力|实用指令(prompt)
GPT已经成为一个不可或缺的科研生产力了,但是大多数人只知晓采用直接提问、持续追问以及细节展开的方式来查阅相关资料,本文侧重于探讨“限定场景限定角色限定主题”、“可持续追问细节展开”等多种方式来获取更多信息,帮人们解决更多问题。 …...

【大数据Hive】hive select 语法使用详解
目录 一、前言 二、Hive select 完整语法树 三、Hive select 操作演示 3.1 数据准备 3.1.1 创建一张表 3.1.2 将数据load加载到t_usa_covid19表 3.1.3 再创建一张分区表 3.1.4 使用动态分区插入数据 3.2 select 常用语法 3.2.1 查询所有字段或者指定字段 3.2.2 查询…...

Android---java线程优化 偏向锁、轻量级锁和重量级锁
java 中的线程是映射到操作系统原生线程之上的,如果要阻塞或唤醒一个线程就需要操作系统的帮忙,这就需要从用户态转换到核心态。状态转换需要花费很多时间,如下代码所示: private Object lock new Object();private int value;p…...
蓝桥杯 2024 15届国赛 A组 儿童节快乐
P10576 [蓝桥杯 2024 国 A] 儿童节快乐 题目描述 五彩斑斓的气球在蓝天下悠然飘荡,轻快的音乐在耳边持续回荡,小朋友们手牵着手一同畅快欢笑。在这样一片安乐祥和的氛围下,六一来了。 今天是六一儿童节,小蓝老师为了让大家在节…...
Leetcode 3577. Count the Number of Computer Unlocking Permutations
Leetcode 3577. Count the Number of Computer Unlocking Permutations 1. 解题思路2. 代码实现 题目链接:3577. Count the Number of Computer Unlocking Permutations 1. 解题思路 这一题其实就是一个脑筋急转弯,要想要能够将所有的电脑解锁&#x…...
MVC 数据库
MVC 数据库 引言 在软件开发领域,Model-View-Controller(MVC)是一种流行的软件架构模式,它将应用程序分为三个核心组件:模型(Model)、视图(View)和控制器(Controller)。这种模式有助于提高代码的可维护性和可扩展性。本文将深入探讨MVC架构与数据库之间的关系,以…...

高等数学(下)题型笔记(八)空间解析几何与向量代数
目录 0 前言 1 向量的点乘 1.1 基本公式 1.2 例题 2 向量的叉乘 2.1 基础知识 2.2 例题 3 空间平面方程 3.1 基础知识 3.2 例题 4 空间直线方程 4.1 基础知识 4.2 例题 5 旋转曲面及其方程 5.1 基础知识 5.2 例题 6 空间曲面的法线与切平面 6.1 基础知识 6.2…...
DeepSeek 技术赋能无人农场协同作业:用 AI 重构农田管理 “神经网”
目录 一、引言二、DeepSeek 技术大揭秘2.1 核心架构解析2.2 关键技术剖析 三、智能农业无人农场协同作业现状3.1 发展现状概述3.2 协同作业模式介绍 四、DeepSeek 的 “农场奇妙游”4.1 数据处理与分析4.2 作物生长监测与预测4.3 病虫害防治4.4 农机协同作业调度 五、实际案例大…...

Python基于历史模拟方法实现投资组合风险管理的VaR与ES模型项目实战
说明:这是一个机器学习实战项目(附带数据代码文档),如需数据代码文档可以直接到文章最后关注获取。 1.项目背景 在金融市场日益复杂和波动加剧的背景下,风险管理成为金融机构和个人投资者关注的核心议题之一。VaR&…...
Web中间件--tomcat学习
Web中间件–tomcat Java虚拟机详解 什么是JAVA虚拟机 Java虚拟机是一个抽象的计算机,它可以执行Java字节码。Java虚拟机是Java平台的一部分,Java平台由Java语言、Java API和Java虚拟机组成。Java虚拟机的主要作用是将Java字节码转换为机器代码&#x…...
Python Einops库:深度学习中的张量操作革命
Einops(爱因斯坦操作库)就像给张量操作戴上了一副"语义眼镜"——让你用人类能理解的方式告诉计算机如何操作多维数组。这个基于爱因斯坦求和约定的库,用类似自然语言的表达式替代了晦涩的API调用,彻底改变了深度学习工程…...

android13 app的触摸问题定位分析流程
一、知识点 一般来说,触摸问题都是app层面出问题,我们可以在ViewRootImpl.java添加log的方式定位;如果是touchableRegion的计算问题,就会相对比较麻烦了,需要通过adb shell dumpsys input > input.log指令,且通过打印堆栈的方式,逐步定位问题,并找到修改方案。 问题…...
作为测试我们应该关注redis哪些方面
1、功能测试 数据结构操作:验证字符串、列表、哈希、集合和有序的基本操作是否正确 持久化:测试aof和aof持久化机制,确保数据在开启后正确恢复。 事务:检查事务的原子性和回滚机制。 发布订阅:确保消息正确传递。 2、性…...