前言:

       记录在修改bug时遇到的一些奇怪问题。

        遇到的奇怪问题1:

                项目中引入了 layui,而且也使用了 layui.use 按需导入了需要的组件,但是在页面每次刚初始化的时候去使用layui,控制台都会报 组件未定义的问题(正常打印layui是可以打印的,但是调用layui.layer或layui.form会报错)。所以在请求接口前,在ready函数里面重新使用layui.use()方法导入form组件

        奇怪问题2:

                在没有使用layui.use("form",function(){})导入组件的时候,页面上select的样式是原生样式,layui样式不会生效。

正文:(select 的使用方式)

<select id="zdName" lay-filter="zdFilter"><option value="">全部</option>
</select>
$(document).ready(function(){layui.use('form',function(){let form = layui.form;//获取部门departListFun()})
})
//获取部门数据接口
function departListFun() {$.ajax({url: rootPath + '/department/listDepartmentAll',type: 'get',dataType: 'json',success:function(data){if (data.length > 0) {let zdDom = document.getElementById("zdName")for(let i = 0; i < data.length; i++){let option = new Option(data[i].name,data[i].name)zdDom.add(option)}layui.form.render('select')//事件绑定layui.form.on("select(zdFilter)",function(data){//  重新获取数据depart = data.value//走接口画柱状图getDataByDepart()//下面柱状图进行联动getDataByType()})}}})
}

layui.form.render("select") 一定一定一定不能忘记!!! 

form.on("select(filter)",callback)

        select 为选择框事件固定名称

        filter 为选择框元素对应的 lay-filter 属性值

 

       

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如若转载,请注明出处:http://www.pswp.cn/diannao/91166.shtml
繁体地址,请注明出处:http://hk.pswp.cn/diannao/91166.shtml
英文地址,请注明出处:http://en.pswp.cn/diannao/91166.shtml

如若内容造成侵权/违法违规/事实不符,请联系英文站点网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

代码随想录day32dp1

文章目录509. 斐波那契数70. 爬楼梯746. 使用最小花费爬楼梯确定dp数组&#xff08;dp table&#xff09;以及下标的含义 确定递推公式 dp数组如何初始化 确定遍历顺序 举例推导dp数组509. 斐波那契数 题目链接 文章讲解 class Solution { public:int fib(int n) {// 1. 确定…

RedisJSON 技术揭秘`JSON.ARRTRIM`用窗口裁剪,让数组保持“刚刚好”

1、指令速查 JSON.ARRTRIM <key> <path> <start> <stop>key&#xff1a;Redis 键名path&#xff1a;JSONPath&#xff0c;默认 $ 根&#xff1b;可用 .[*]/.. 多路径匹配start / stop&#xff1a;要保留的 [start, stop] 闭区间索引 支持负值&#xff…

fpga调试经验

fpga调试经验 调测场景&#xff1a; 外接adc传感器芯片&#xff0c;采集压力&#xff0c;温度等模拟量&#xff0c;fpga通过spi/i2c接口与adc传感器芯片通信 问题1&#xff1a;adc芯片在稳定环境中&#xff0c;输出数字量不稳定。 结论&#xff1a;adc输入电压由fpga板供应&…

cefSharp.WinForms.NETCore 138.xx (cef138/Chromium 138.0.7204.97) 升级测试体验

一、版本说明及变化 该版本支持cef138.0.x系列,cefsharp138.0.170 无重大更新;该版本暂不支持h264,请关注后续 关注栏目,关注我,学习cefsharp少走弯路 不迷路! CefSharp 设置缓存的注意事项参考 说明:栏目是订阅文章,无附件,如需要单独获取(看底部介绍说明) 该版本1…

chatgpt是怎么诞生的,详解GPT1到GPT4的演化之路及相关背景知识

人工智能革命正在发生&#xff0c;我们是何其幸运的一代&#xff0c;能亲眼见证人类/机器智能的大爆发。 仅仅作为这场革命的看客显然是有些遗憾的&#xff0c;如何进一步了解它&#xff1f; 本文将讨论chatgpt的诞生过程&#xff0c;串联起OpenAI发表的一系列重要论文&#…

[笔记] 动态 SQL 查询技术解析:构建灵活高效的企业级数据访问层

文章目录一. 应用场景二. 使用示例示例1示例2示例3三. 实现1. 动态表查询构建器&#xff0c;模仿MyBatis-Plus2. mapper3. mapper.xml功能概述参数说明四. 动态 SQL 的优化与风险防控在企业级应用开发中&#xff0c;数据查询场景往往呈现出复杂多变的特点 —— 从简单的单表筛选…

.net天擎分钟降水数据统计

1.需求&#xff1a;计算滑动时间下的1小时、3小时、6小时、12小时、24小时降水数据&#xff0c;统计这个时间下的分钟级降水数据2.分析第一版本&#xff1a;降水分钟级数据保存时间不长&#xff0c;保存太多意义不大&#xff0c;以更新的形式来保存这些统计数据效果会比较好&am…

图片合并pdf

文章目录 背景目标实现下载 背景 整合&#xff1a; 将零散的图片集合成一个单一文件。有序化&#xff1a; 固定图片的排列顺序。标准化&#xff1a; 转换为通用、兼容性强的PDF格式。高效管理&#xff1a; 便于存储、查找、分享和传输。正式化/文档化&#xff1a; 满足提交、报…

【vue3+js】文件下载方法整理

前端文件下载方式 引言 在前端开发中,文件下载是一个常见的需求。后端可能以不同的方式返回文件数据,前端需要根据不同的返回类型采用相应的处理方式。本文将总结几种常见的后端返回类型及对应的前端处理方案,主要基于Vue3和JavaScript环境。 一、后端返回文件URL 场景描…

MicrobiomeStatPlots | 森林图教程Forest plot tutorial

视频讲解https://www.bilibili.com/video/BV1mA3yzEEnc/森林图简介什么是森林图&#xff1f;参考&#xff1a;https://mp.weixin.qq.com/s/vwNf_sFlmhp7DeSYaQ3NxQ森林图是以统计指标和统计分析方法为基础&#xff0c;用数值运算结果绘制出的图形。它在平面直角坐标系中&#x…

vscode 打开项目时候,有部分外部依赖包找不到定义或者声明,但是能使用cmake正常编译并且运行

解决&#xff1a;是依赖路径的问题&#xff0c;先看includePath对不对&#xff0c;但是有时候会依赖外部文件&#xff0c;这时候入股cmake编译能够听过&#xff0c; 说明编译器能够找到依赖路径&#xff0c; 但是vscode的 IntelliSense 找不到依赖路径 → 导致编辑器提示错误、…

nginx:SSL_CTX_use_PrivateKey failed

SSL_CTX_use_PrivateKey("/home/nginx-vue/cret/*.com.key") failed (SSL: error:0B080074:x509 certificate routines:x509_check_private_key:key values mismatch) Nginx 尝试加载私钥文件时失败&#xff0c;原因是&#xff1a;证书与私钥不匹配 问题本质 SSL 证…

Docker 基于 Cgroups 实现资源限制详解【实战+源码】

本文将带你深入理解 Docker 如何借助 Linux Cgroups 实现对内存、CPU 等系统资源的精细化控制&#xff0c;并提供完整演示与图解、Compose 配置模板和资源包下载&#xff0c;适合初学者与工程师深入学习与实战。 文章目录 一、什么是 Cgroups&#xff1f;为什么对容器如此关键…

Linux中的系统日志(Rsyslog)

一、实验环境主机名系统网络适配器IP地址serverarhel9NAT模式172.25.254.11/24serverbrhel9NAT模式172.25.254.22/24二、Rsyslog的基本参数&#xff08;1&#xff09;安装rsyslog&#xff08;2&#xff09;rsyslog的服务名称&#xff08;3&#xff09;rsyslog的主配置文件rsysl…

Spring Boot + Thymeleaf + RESTful API 前后端整合完整示例

关键词&#xff1a;Spring Boot、Thymeleaf、RESTful API、前后端整合、用户管理 ✅ 功能概述 本文将为你提供一个完整的 Spring Boot Thymeleaf RESTful API 的前后端整合项目&#xff0c;实现以下功能&#xff1a; 模块功能用户管理查看用户列表、新增用户、删除用户后端…

从零开始的MySQL学习

MySQL 从零开始的MySQL学习 第一节 数据库 重点&#xff1a;数据库通过SQL等标准语言进行动作&#xff0c;数据库的概念、分类&#xff0c;数据管理系统&#xff08;操纵和管理数据库的大型软件&#xff09; 数据库&#xff08;Database&#xff09; 是按照数据结构来组织、存储…

Docker 高级管理--Dockerfile镜像制作

二:Dockerfile 语法基础 1:基础指令 (1)FROM 指定基础镜像&#xff0c;所有的 Dockerfile 都必须以 FROM 指令开头&#xff0c;它定义了新镜像基于哪个基础镜像构建。 FRoM ubuntu:20.04 (2)MAINTAINER(已奔用&#xff0c;推荐使用LABEL) 用于指定镜像的维护者信息。不过在较…

LeetCode 692题解 | 前K个高频单词

前K个高频单词一、题目链接二、题目三、分析四、代码一、题目链接 692.前K个高频单词 二、题目 三、分析 本题目我们利用map统计出次数以后&#xff0c;返回的答案应该按单词出现频率由高到低排序&#xff0c;有一个特殊要求&#xff0c;如果不同的单词有相同出现频率&#…

C++ 中的 std::bind 用法

在现代 C++ 编程中,std::bind 是一个非常强大但常常被误解的工具。它允许我们将函数(包括成员函数)、参数进行绑定,并生成一个新的可调用对象。这在编写异步回调、事件处理、适配器模式等场景中非常有用。 🔧 一、std::bind 是什么? std::bind 是定义在 <functiona…

Spring Boot秒级冷启动方案:阿里云FC落地实战(含成本对比)

Spring Boot秒级冷启动方案&#xff1a;阿里云FC落地实战&#xff08;含成本对比&#xff09;一、冷启动痛点与FC核心优势1. 传统Spring Boot冷启动瓶颈2. 阿里云FC核心能力二、秒级冷启动架构设计1. 整体架构2. 关键组件选型三、5大核心优化策略1. 应用瘦身&#xff08;JAR包精…