当前位置: 首页 > news >正文

测试常见前端bug

目录

协作

测试方法

标签:标签 内容/ref/

判断

arr&&arr.length

交互

样式不生效:devtools查找,编译前的标签,运行时不一定存在

可交互的需要提示

hover样式

没有交互逻辑,就不要设置交互

无法交互的情况需要交互失效

超出内容的样式 

设置数据前要清空

注意区分中英文符号(,:)

提示

表单validate

覆盖已有内容的红色边框

设置select样式


协作

改了公共组件后,要把其他用到公共组件的地方也改了,vs中搜索即可

​​​​​​​

测试方法

标签:标签 内容/ref/

    <div class="right-wrap">{{ formData.moduleDataType.includes(1) }}<mds-tabs position="right" v-model="active" @change="scroll(active, $event)"><mds-tabs-pane ref="ttttt" tab="1" :index="1">1</mds-tabs-pane><mds-tabs-pane style="color: brown;" tab="2" :index="2">2</mds-tabs-pane><mds-tabs-pane tab="3" :index="3">3</mds-tabs-pane></mds-tabs></div>

判断

arr&&arr.length

交互

样式不生效:devtools查找,编译前的标签,运行时不一定存在

可交互的需要提示

hover样式

.span-operate {color: #1564FF;cursor: pointer;}

没有交互逻辑,就不要设置交互

无法交互的情况需要交互失效

例如:无成功上传的文件则无法进行下一步

超出内容的样式 

 

设置数据前要清空

openLogDrawer() {this.logData = [];API.getQuery(`getOtherIndexFileLog/${this.wpReleId}`).then((res: any) => {res.data.forEach((val: any) => {this.logData.push({name: val.fileNm || 'undefined',time: val.createTm || 'undefined',creator: val.creator || 'undefined',state: this.status[val.status] || 'undefined',fileUrl: val.fileUrl || 'undefined',fileLogId: val.id || -1,})})this.visibility = true})}

注意区分中英文符号(,:)

​​​​​​​

提示

表单validate

 

 

覆盖已有内容的红色边框

  ::v-deep .validate-success .mds-input {border-color: #d8dce6 !important;}

设置select样式

<mds-select :class="{'validate-success': formData.confmTm}" >
<mds-option v-for="item in CONFM_TM" :value="item.id" :label="item.label" :disabled="isDisabledTm(item)"/>
</mds-select>

相关文章:

测试常见前端bug

目录 协作 测试方法 标签&#xff1a;标签 内容/ref/ 判断 arr&&arr.length 交互 样式不生效&#xff1a;devtools查找&#xff0c;编译前的标签&#xff0c;运行时不一定存在 可交互的需要提示 hover样式 没有交互逻辑&#xff0c;就不要设置交互 无法交互…...

【Python数据分析】Python常用内置函数(一)

&#x1f389;欢迎来到Python专栏~Python常用内置函数&#xff08;一&#xff09; ☆* o(≧▽≦)o *☆嗨~我是小夏与酒&#x1f379; ✨博客主页&#xff1a;小夏与酒的博客 &#x1f388;该系列文章专栏&#xff1a;Python学习专栏 文章作者技术和水平有限&#xff0c;如果文…...

OpenCV图像处理-图像分割-MeanShift

MeanShift 1. 基本概念2.代码示例 1. 基本概念 MeanShift严格说来并不是用来对图像进行分割的&#xff0c;而是在色彩层面的平滑滤波。它会中和色彩分布相近的颜色&#xff0c;平滑色彩细节&#xff0c;侵蚀掉面积较小的的颜色区域&#xff0c;它以图像上任意一点P为圆心&…...

【Rust 基础篇】Rust Trait 实现:灵活的接口抽象

导言 Rust是一种以安全性和高效性著称的系统级编程语言&#xff0c;其设计哲学是在不损失性能的前提下&#xff0c;保障代码的内存安全和线程安全。为了实现这一目标&#xff0c;Rust引入了"所有权系统"、"借用检查器"等特性&#xff0c;有效地避免了常见…...

【嵌入式Linux项目】基于Linux的全志H616开发板智能家居项目(语音控制、人脸识别、安卓APP和PC端QT客户端远程操控)有视频功能展示

目录 一、功能需求 二、开发环境 1、硬件&#xff1a; 2、软件&#xff1a; 3、引脚分配&#xff1a; 三、关键点 1、设计模式之工厂模式 2、wiringPi库下的相关硬件操作函数调用 3、语音模块的串口通信 4、线程 5、摄像头的实时监控和拍照功能 6、人脸识别 四、编…...

ElasticSearch基础篇-条件查询与映射

ElasticSearch基础篇二 条件查询 GET http://10.192.193.98:9200/shopping/_search?qtitle:小米手机q:代表查询条件 响应结果 {"took": 772,"timed_out": false,"_shards": {"total": 1,"successful": 1,"skipped…...

大模型部署框架 FastLLM 实现细节解析

0x0. 前言 接着 大模型部署框架 FastLLM 简要解析 这篇文章首先梳理了一下FastLLM的调用链和关键的数据结构&#xff0c;然后解析了 FastLLM 的一些实现细节和CPU/GPU后端实现采用的优化技巧。 0x1. 调用链和数据结构解析 以chatglm-6b的支持为例&#xff0c;函数入口在 htt…...

Flutter ios真机调试连接断开后应用闪退

使用ios真机调试的时候&#xff0c;能正常打开应用&#xff0c;但是当数据线断开连接的时候&#xff0c;应用就会关闭&#xff0c;重新打开就会闪退。 原因是flutter默认在开发过程中使用debug模式编译 只需要将debug选择为release 重新编译就行。...

序列化,反序列化之实例

别怕&#xff0c;我一直陪着你 一.知识1.魔术方法 二.实例1.绕过__wakeup, private2.php://filter, data://, __tostring3. 一.知识 1.魔术方法 __construct() 当一个对象创建时自动调用 __destruct() 当对象被销毁时自动调用 (php绝大多数情况下会自动调用销毁对象) __sleep…...

2022年全国职业院校技能大赛(高职组)“软件测试”赛项竞赛任务书

2022年全国职业院校技能大赛&#xff08;高职组&#xff09; “软件测试”赛项竞赛任务书 2022年7月 一、竞赛时间、内容及成绩组成 &#xff08;一&#xff09;竞赛时间 本阶段竞赛时间共为8小时&#xff0c;参赛选手自行安排任务进度&#xff0c;休息、饮水、如厕等不设专…...

第18节:R语言分析:临床安全性数据的数据分析

临床安全性数据的数据分析 背景 医疗器械临床试验中收集的数据的主要组成部分是关于患者安全的。 不良事件被定义为“受试者、使用者或其他人的任何不良医疗事件、非预期疾病或伤害,或不良临床体征(包括异常实验室发现),无论是否与研究医疗器械相关”。 收集并用于此数据…...

36.悬浮板

悬浮板 html部分 <div class"container"><div class"square"></div> </div>css部分 *{margin: 0;padding: 0; } body{background-color: #111;height: 100vh;overflow: hidden;display: flex;justify-content: center;align-it…...

BLE基础理论/Android BLE开发示例

参考&#xff1a;https://blog.csdn.net/qq_36075612/article/details/127739150?spm1001.2014.3001.5502 参考&#xff1a; https://blog.csdn.net/qq_36075612/article/details/122772966?spm1001.2014.3001.5502 目录 蓝牙的分类传统蓝牙低功耗蓝牙 蓝牙专业词汇&#xff…...

rocketmq 5.13任意时间延迟消息

原理是采用timewhile 实现的&#xff0c;源码分析可以参考 https://blog.csdn.net/sinat_14840559/article/details/129266105 除了useDelayLevel 已经默认改为false private boolean useDelayLevel false;官方示意代码在public class TimerMessageProducer for (int i 0;…...

小程序picker 在苹果手机不兼容 bug,按month时在iPhone 显示不正确及自动定位时间问题

如下图&#xff1a;点击弹出时间列表&#xff1a;日历控件点击选择显示1年1月 解决: 加上起始时间字段 <picker mode"date" value"{{date}}" start"1970-09-01" end"2030-09-01"></picker> 问题二&#xff1a; 还是&a…...

区块链服务网络的顶层设计与应用实践

日前&#xff0c;2023全球数字经济大会专题论坛&#xff1a;Web3.0发展趋势专题论坛暨2023区块链、元宇宙蓝皮书发布会在北京举行。本次论坛上隆重发布了《中国区块链发展报告&#xff08;2023&#xff09;》&#xff0c;对我国区块链行业在2022年的发展状况进行了总结梳理&…...

tomcat日志输出乱码

在Tomcat中&#xff0c;默认的字符编码可能导致应用参数日志出现乱码问题。这通常发生在接收来自客户端的请求参数&#xff0c;并将其记录到日志文件时。 Tomcat默认使用平台的默认字符编码&#xff0c;这可能是不稳定的&#xff0c;特别是当应用程序运行在不同的操作系统上时…...

Form1单例模式与互斥锁

一、使用mutex来解决。 如何让窗体Form1也是一个单例模式呢&#xff1f; 在窗体项目中找到Program.cs&#xff0c;双击。找到入口点&#xff0c;更改如下&#xff1a; [STAThread]private static void Main(){string mutexName "MyapplicatonMutexApp1121";usin…...

MySQL | 常用命令示例

MySQL | 常用命令示例 一、启停MySQL数据库服务二、连接MySQL数据库三、创建和管理数据库四、创建和管理数据表五、数据备份和恢复六、查询与优化 MySQL是一款常用的关系型数据库管理系统&#xff0c;广泛应用于各个领域。在使用MySQL时&#xff0c;我们经常需要编写一些常用脚…...

常见网关对比

常见网关对比 目前常见的开源网关大致上按照语言分类有如下几类&#xff1a; Nginxlua &#xff1a;OpenResty、Kong、Orange、Abtesting gateway 等 Java &#xff1a;Zuul/Zuul2、Spring Cloud Gateway、Kaazing KWG、gravitee、Dromara soul 等 Go &#xff1a;Janus、fa…...

文墨共鸣大模型入门指南:Ubuntu 20.04系统下的保姆级部署教程

文墨共鸣大模型入门指南&#xff1a;Ubuntu 20.04系统下的保姆级部署教程 想试试最近挺火的文墨共鸣大模型&#xff0c;但被复杂的部署步骤劝退了&#xff1f;别担心&#xff0c;这篇教程就是为你准备的。咱们今天不谈复杂的原理&#xff0c;就手把手教你&#xff0c;如何在Ub…...

如何让Windows 11告别臃肿?Win11Debloat完整指南帮你一键优化系统

如何让Windows 11告别臃肿&#xff1f;Win11Debloat完整指南帮你一键优化系统 【免费下载链接】Win11Debloat A simple, lightweight PowerShell script that allows you to remove pre-installed apps, disable telemetry, as well as perform various other changes to declu…...

北京联通IPTV组播配置实战:OpenWRT与udpxy的完美结合

1. 为什么需要OpenWRTudpxy方案 家里换了新电视后&#xff0c;突然想把闲置的北京联通IPTV利用起来。传统机顶盒接线麻烦不说&#xff0c;还占用了宝贵的HDMI接口。经过实测&#xff0c;用OpenWRT路由器配合udpxy插件转换组播信号&#xff0c;才是真正的"一劳永逸"解…...

一站式屏幕神器eSearch:如何5分钟打造你的智能工作流?

一站式屏幕神器eSearch&#xff1a;如何5分钟打造你的智能工作流&#xff1f; 【免费下载链接】eSearch 截屏 离线OCR 搜索翻译 以图搜图 贴图 录屏 万向滚动截屏 屏幕翻译 Screenshot Offline OCR Search Translate Search for picture Paste the picture on the screen Scree…...

IndexTTS 2.0优化指南:如何选择参考音频,获得最佳克隆效果

IndexTTS 2.0优化指南&#xff1a;如何选择参考音频&#xff0c;获得最佳克隆效果 1. 引言&#xff1a;为什么参考音频如此重要&#xff1f; 在语音合成领域&#xff0c;参考音频就像是一把钥匙&#xff0c;决定了最终生成声音的质量和相似度。IndexTTS 2.0作为一款零样本音色…...

从AMP到cuFFT:半精度训练中非2的幂维度问题的深度解析与实战规避

1. 从报错信息看半精度训练中的cuFFT限制 最近在调试一个深度学习模型时&#xff0c;遇到了这样的报错&#xff1a;"RuntimeError: cuFFT only supports dimensions whose sizes are powers of two when computing in half precision"。这个错误看似简单&#xff0c…...

AI驱动的科研绘图革命:DeTikZify如何终结图表代码的手动时代

AI驱动的科研绘图革命&#xff1a;DeTikZify如何终结图表代码的手动时代 【免费下载链接】DeTikZify Synthesizing Graphics Programs for Scientific Figures and Sketches with TikZ 项目地址: https://gitcode.com/gh_mirrors/de/DeTikZify 当deadline遇上绘图难题&a…...

Ollama+Qwen2.5-VL搭建教程:打造你的智能视觉分析工具

OllamaQwen2.5-VL搭建教程&#xff1a;打造你的智能视觉分析工具 1. 引言&#xff1a;为什么选择Qwen2.5-VL 在当今AI技术快速发展的时代&#xff0c;视觉-语言多模态模型正成为解决复杂问题的关键工具。Qwen2.5-VL-7B-Instruct作为通义千问系列的最新成员&#xff0c;在视觉…...

别再只看波形了!用Maxwell+Matlab深度分析电机空载气隙磁密的谐波极对数分布

电机电磁设计进阶&#xff1a;从Maxwell FFT到Matlab谐波极对数分析的工程实践 在电机设计领域&#xff0c;空载气隙磁密的谐波分析一直是评估电磁性能的核心手段。传统方法往往止步于波形观察和简单频谱分析&#xff0c;却忽略了谐波极对数分布这一关键维度——它直接关联着电…...

Phi-4-reasoning-vision-15B部署教程:开源大模型镜像适配国产GPU方案

Phi-4-reasoning-vision-15B部署教程&#xff1a;开源大模型镜像适配国产GPU方案 1. 模型介绍 Phi-4-reasoning-vision-15B是微软推出的视觉多模态推理模型&#xff0c;具备强大的图像理解和分析能力。这个15B参数规模的模型特别擅长处理需要结合视觉和语言理解的复杂任务。 …...