
Web前端
文章平均质量分 54
Web前端
zhaocarbon
C、C++、ObjectiveC、swift、html、css、javascript、C#、Java、vue、jquery、uniapp、微信小程序……
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
el-form elform 对齐方式调整
页面表单,有时候我们想着最左侧的应该合理整齐的左对齐,右侧的表单都是右对齐,这样页面看起来会整洁很多。需要注意的是我使用的是栅格cl-row/col布局,你使用的什么就使用什么父元素来筛选。二、右对齐时,最左侧一列又显示凌乱。一、左对齐时,中间出现过多空白。如下页面表单,展示后就很丑。三、修正样式后看起来舒服多了。原创 2025-05-22 16:57:13 · 477 阅读 · 0 评论 -
Blocked aria-hidden on an element because its descendant retained focus.
经过分析发现el-popover及el-radio__original有aria-hidden属性,具体aria-hidden属性应用自行搜索了解。在使用el-popover和el-radio-group实现弹窗选择数据后调用el-popover的doClose()方法时一直报错!给el-popover添加@show="popshow"方法,显示后移除相应的属性!世界一下子干净了好多。原创 2025-02-08 17:53:53 · 1242 阅读 · 0 评论 -
VUE elTree 无子级 隐藏展开图标
给el-tree结构配置一下props,注意!:props="defaultProps"查阅官方文档如下描述,支持bool和函数回调处理,这里咱们选择更灵活的函数回调实现。这4个并没有下级节点,即它并不是叶子节点,就不需求展示前面的三角展开图标!完成后,刷新页面显示正常,不再给用户制造操作误途。原创 2025-01-22 23:42:18 · 941 阅读 · 0 评论 -
vue2 web 多标签输入框 elinput是否当前焦点
tags用于默认值的回调,changed事件用于组件数据发生变化时的回调通知。组件本身也比较简单,没有啥值得去细分和品评的技术点。又来分享一点点工作积累及解决方案。原创 2025-01-15 17:43:05 · 779 阅读 · 0 评论 -
VUE条件树查询 自定义条件节点
之前实现过的简单的条件树功能如下图:经过最新客户需求确认,上述条件树还需要再次改造,以满足正常需要!原创 2025-01-04 19:47:24 · 1041 阅读 · 5 评论 -
VUE echarts 教程七 折线图 自定义样式
【代码】VUE echarts 教程七 折线图 自定义样式。原创 2025-01-02 15:15:33 · 344 阅读 · 0 评论 -
VUE echarts 教程六 动态排序折线图 echarts动画
【代码】VUE echarts 教程六 动态排序折线图。原创 2025-01-02 15:12:06 · 246 阅读 · 0 评论 -
javaScript 神奇语法糖
本文介绍了 JavaScript 中常用的 40 种语法糖,涵盖变量声明、对象操作、函数简写和现代语法特性等多个方面。掌握这些语法糖,可以使代码更简洁、更易读,并提升开发效率。我们鼓励大家在实际项目中尝试这些技巧,感受它们带来的便利。现在,请思考一下:你在日常开发中还遇到过哪些让你惊艳的语法糖?欢迎在评论区分享你的经验和见解,让我们一起进步!原创 2025-01-02 15:04:07 · 1089 阅读 · 0 评论 -
VUE echarts 教程四 双变量关系图
【代码】VUE echarts 教程四 双变量关系图。原创 2024-12-30 20:52:43 · 498 阅读 · 0 评论 -
VUE echarts 教程三 凹凸图
【代码】VUE echarts 教程三 凹凸图。原创 2024-12-30 20:50:46 · 370 阅读 · 0 评论 -
VUE echarts 教程二 折线堆叠图
【代码】VUE echarts 教程二 折线堆叠图。原创 2024-12-30 20:42:27 · 524 阅读 · 0 评论 -
VUE echarts 教程一 折线图
拆线内部填充:面积图。原创 2024-12-30 20:36:45 · 363 阅读 · 0 评论 -
vue canvas 绘制选定区域 矩形框
客户那边文档相当的多,目前需要协助其将文档转为数据写入数据库,并与其他系统进行数据共享及建设,所以不得不搞一个识别的功能,用户上传PDF文档后,对于关键信息点进行识别入库!页面整体代码,包含一些测试数据,我没有删除,你自己进行分析删除即可.以下为核心代码,直接分享,到中午吃饭时间了,就大概分享一下。以上是核心代码,绑定点击及拖动事件绘制待定区域!原创 2024-12-13 11:55:52 · 616 阅读 · 2 评论 -
web vue 滑动选择 n宫格选中 九宫格选中
给最后一个元素塞入5行6列的数据,因为VUE本身就是MVVM,即我们好数据,对数据进行直接操作时,页面则会动态渲染。数据定义,元素从左到右均在数组中定义,只有最后一个元素时,才会显示自定义宫格功能,所以,数据仍然定义在其child中,注意其他元素并没有child。页面动态布局经常性要交给客户来操作,他们按时他们的习惯在同一个屏幕内显示若干个子视图,尤其是在医学影像领域对于影像的同屏显示目视对比显的更为重要。我使用的elmentUI,其主题默认是白色,我根据页面修改了组件的样式:你想改就改,不改就忽略。原创 2024-12-03 15:52:27 · 662 阅读 · 0 评论 -
el-select 修改样式
灯红酒绿总有人看着眼杂,但将风格统一终究是上上选择。下面来处理这个问题。这样漂亮的页面,搭配的却是一个白色风格的下拉框 ,这也过于刺眼。1、修改触发框的样式,将边框、背景颜色置为匹配的颜色。给el-select添加popper-class。第二部分:是修改弹出的popover的样式。2、修改弹出的popover的样式。添加CSS样式修改对应的UI样式。第一部分:是修改触发框的样式。原创 2024-12-01 23:08:57 · 915 阅读 · 0 评论 -
eltable el-table 横向 滚动条常显
修改默认样式如下:这里减40的目的是将eltable的header高度减掉,控制它的可视区域,让横向滚动条常显在底部。又遇到了难受的问题,el-table嵌入在一个div里面,结果因为内容太多,横向、纵向我都得滚动查看!结果发现横向滚动时只能让它纵向触底后才能进行横向操作,这就很变态,明显不符合用户操作习惯。要先纵向触底再进行横向操作,这。这样横向、纵向操作就没问题了,互不影响。原创 2024-11-30 19:11:39 · 1612 阅读 · 0 评论 -
医学影像DICOM 处理(一)
DICOM是医学图像和相关信息的国际标准,它定义了满足临床需要的可用于数据交换的医学图像格式,被广泛用于放射、成像的诊疗诊断设备。也就是说,在医院放射科使用的设备上读取的影像基本都是DICOM格式,包括CT、MRI、超声等的讲解及技术规范。咱就不展开讨论了,网上一堆,大家去查阅即可。我就在想,区域链、人工智能、AI等等这些喙头啥时候是个头儿。咱的项目基本都是趋于实战,很少讲原理,因为有些原理讲起来可能我就没那么多心血来写作了,那么大篇幅的进行整理及输出。细节的代码注释则不进行讲解了,自己研究查看。原创 2024-11-10 18:22:41 · 864 阅读 · 0 评论 -
vue echarts左右间距调整 左右空白
经过调整后,嗯,好看了很多。咱就说这样的左右间距丑不丑。原创 2024-11-06 12:07:32 · 656 阅读 · 0 评论 -
vue2之css 滚动条设置(颜色、宽度、滑块等)
【代码】vue2之css 滚动条设置(颜色、宽度、滑块等)原创 2024-05-21 17:34:03 · 877 阅读 · 0 评论 -
pm2 部署vue
我本想着给他安装node.js、vscode、mysql,按照我开发过程中运行系统的方式让他运行,等我开发完成后,我才发现这样的操作体验就是一场灾难,他上班后每天就是开机,打开vscode点击run dev,然后去执行脚本运行node写的服务!这样的使用体验真的是一场灾难!:你项目终端运行的命令参数,如果是npm run dev这里就是dev,如果是npm run serve这里就是serve,你自己根据实际填写。:项目脚手架脚本,因为我项目使用的是Vue_cli创建的,所以,我指向VUE的脚本。原创 2024-10-22 00:22:34 · 1278 阅读 · 0 评论 -
elselect iphone上 要点两次
。原创 2024-10-25 12:25:54 · 1346 阅读 · 0 评论 -
el-scrollbar 动态更新内容 鼠标滚轮无效
即加号、减号点击就是在年月日显示进行切换。给Scrollview添加了鼠标滚动事件:当切换日期显示时滚轮滚动时,scrollview的滚动条没有反应,就很奇葩。因scrollview内的内容不断的进行变化,他的contentsize也是动态变化,但此时当切换后鼠标滚轮无法触发Scrollview的滚动条一块儿跟着滑动。有以下功能逻辑,实现了一个时间轴组件,点击+、-号向地图那样放大组件以显示不同的UI。修正方案为:强行更新scrollview,出现的问题随之修复。原创 2024-11-05 16:30:16 · 866 阅读 · 0 评论 -
elementUI 点击弹出时间 date-picker
elementUI的日期组件,有完整的UI样式及弹窗,但是我的页面不要它的UI样式,点击的时候却要弹出类似的日期选择器,那怎么办呢?这是我的项目中要用到的UI风格:区别在于我不需要它的输入框来触发!以下是elementUI自带的UI风格,一定要一个输入框来触发。原创 2024-11-05 17:30:58 · 1475 阅读 · 0 评论 -
vue mysql 直连
最近又搞了个小项目,单机版本的内部考勤管理系统,直接部署在对方的工作电脑上,不需要在云端部署,因为项目本身就小,我就没配置后端同事进行开发,而是通过VUE直连mysql进行业务开发及保存。后期再通过PM2来守护页面及服务,随时打开使用。下面来复盘一下整体开发过程。原创 2024-10-24 15:32:08 · 2172 阅读 · 0 评论 -
elementUI this.$msgbox msgBox自定义 样式自定义 富文本
再次使用多个span标签来显示组合的文本消息,因为span标签是行元素,所以多个会被渲染在同一行,并且根据你给出的样式进行渲染!它的作用就是告诉msgBox从这儿开始换行,充分利用P标签是块标签(独占一行)来进行内容的行切换。看这个效果是不是很炫?突出重点提示内容,对于用户交互相当的棒!原创 2024-03-30 18:19:12 · 1120 阅读 · 0 评论 -
微信小程序 进度圆环组件
官方组件非常局限,很多组件没有或者是生态也没有成熟的案例,导致开发人员,不得不从头去写去实现,经过测试此组件功能正常,没有什么问题,特提供出来,共同进度。对于IT发展及技术的执着,周末闲来无事,就写了一个小组件,目的是提升自我的同时,熟悉一下小程序的开发流程,不至于给忘掉以至于生疏无法上手。指定组件大小及进度、进度环大小!原创 2023-01-07 19:45:00 · 609 阅读 · 0 评论 -
HTTP请求之GET及POST详解
GET方式:请求URL固定,所有参数均后缀在URL后面,以key=value&key1=value1&key2=value2方式拼装POST方式:1、请求URL固定,所有参数均放在http的请求报文中,即放在了body中!所有参数以json或者XML格式序列化文本串或form-data传输。2、请求URL不固定,部分参数会放在URL中,即http://domain.com/userlogin/login?sign=xxx×tamp=xxx以拼装成最终的.原创 2022-03-04 17:01:47 · 3556 阅读 · 0 评论 -
Invalid prop: custom validator check failed for prop “index“
在进行Web前端开发使用elementUI时,因为el-menu-item是动态加载的,不是页面写死,进行(item,index) in array 遍历动态设置el-menu-item的index时,一直提示Invalid prop: custom validator check failed for prop "index",并且选中状态不正确显示!从提示上来看,就是检测的类型不匹配,经过查阅官方文档给出的demo:el-menu-item的index为string类型,不是int类型!&原创 2020-11-16 11:55:00 · 1464 阅读 · 0 评论 -
nuxt封装http服务
进行前端开发,任何时候都得有一个请求接口的工具,无论是原生app还是Vue,还是nuxt.js,还是普通的javascript。目前接手一个nuxt.js的项目,因为它也是基于vue.js的项目,在这个世风日下的环境下,接个私活,赚点外快,也同时训练一下自已的技能,提升一下自已的水平。现在我们来撸代码,为后续的开发打好基础。我们为什么要封装这么一个文件呢?部分的公共的业务我们直接封装在此处执行,不必在每个调用接口的页面文件中写重复的代码,比如token过期,我们直接在这儿提示。比如用户被强制下线原创 2020-11-04 14:12:29 · 1594 阅读 · 0 评论 -
nuxt.js跨域 解决
在进行nuxt.js开发过程中,进行服务器接口调用时,发现报错,接口不通。类似于如下截图:Failed to load http://example.com/api/somethings.do: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'htt原创 2020-11-04 13:51:17 · 2549 阅读 · 2 评论 -
微信小程序开发实战第五讲之授权登录
上一节,我们实现了简单的通过用户名和密码调用接口进行登录的实战,但是在小程序中,有个特殊的情况,就是很少有厂商去开发一个注册功能或者是通过用户名+密码来登录的逻辑,为什么?因为APP、小程序为了用户体验,是尽量多的避免用户多次输入交互,所以,这个时候,一键通过微信登录,非常方便。就像我们的平常做的SNS社交一键登录一样。本节我们来学习使用微信一键登录功能。首先准备一张微信UI素材,...原创 2020-04-15 10:44:26 · 938 阅读 · 0 评论 -
微信小程序开发实战第四讲
上一讲,我们已经创建了一个微信小程序项目,简单分解了项目中的文件及页面功能,本节,我们继续以上节课程中创建的项目以蓝本进而示意更多页面及业务逻辑的开发。大部分程序都是要求用户登录后才可以使用的。我们就行实现一个简单的登录页面,从中理解更多的关于页面布局、页面结构等的技能及知识。如上图,在pages文件中右键,选择->新建文件夹,我们先创建一个文件目录,命名为login,用于存放、...原创 2020-04-01 11:21:52 · 394 阅读 · 0 评论 -
微信小程序开发实战第三讲
有了前两节的哆哩哆嗦的铺垫,相信有些同学已经懵逼了,有些同学可能已经心有所悟。不管是哪种情形,建议你还是接着头皮发麻的向下看,看的同时,涉及到代码的,你必须全程跟着敲一遍代码,动一下手。否则你这纯粹是耍流氓,不是来学习的,而是来打发时间的。 本讲时,博主使用的是微信开发者工具 1.02.2003250版本,后续的版本不能保证新建项目时,界面是否会发生变化。打开微信开发者工具...原创 2020-03-31 14:06:14 · 320 阅读 · 0 评论 -
微信小程序实战 第一讲
在正式进行教程之前,先做一下思想工作,让读者朋友们心里做到这是什么?要学习什么?能做什么?如果你连本节都没有兴趣阅读下去,那请您移步别处去吧,就不浪费您的时间了。第一,小程序是什么? 说到这里,再说说,为什么要跨平台,一些小白可能认为,开发一个程序为什么不能在其他平台(系统)运行,很是纳闷,因为不同的平台(系统)是使用不同的技术(高级编程语言)开发实现的,同一种语言编写的程序...原创 2020-03-25 11:36:06 · 2032 阅读 · 0 评论 -
微信小程序开发实战第二讲
上一篇教程我们说过,小程序的技术范畴仍然是Web技术,而web视图展现的核心东西又是CSS(层叠样式表),当然这个东西也是随着时代在进步,前有CSS,现在有CSS3,当然CSS3是兼容老的CSS的,你也不要怕这个东西,尤其是新接触WEB开发的同学,不要怕。CSS的目的是向视图添油加醋,使视图漂亮、美观、现代化。学习CSS,核心要掌握的就是布局。正如你所体验,页面的展示不外乎列表、tab多标签这...原创 2020-03-27 11:57:06 · 269 阅读 · 0 评论 -
解决webstorm中vue语法没有提示
https://blog.youkuaiyun.com/weixin_42795449/article/details/84112876转载 2019-06-09 16:02:58 · 6036 阅读 · 0 评论 -
VUE 自定义子组件v-bind及v-on指令的大小写问题
Vue好不好?呵呵,也许好,也许不好。那他的语义定义好不好?只能说马马虎虎。心情不好点,可以说,那就是灾难看如下:父向子组件传递参数过来,使用v-bind指令,我说去你大爷!使用砣峰式,页面啥也不渲染!!页面空白!不知道为啥?这种低等的BUG,能出现在一个相对成熟的框架中,也是有些恶心到人。再看如下:子组件向父传递回调,尼玛,V-ON后面的方法出现驼峰时,根本无法回馈到父方...原创 2019-07-09 16:24:09 · 2882 阅读 · 4 评论 -
VUE select 双向绑定
如下截图及源码,可以跑起来看看效果,select的双向绑定,指定v-model键就可以,内部的option被选中后,对应的值就会透传到select的v-model指令中。使用的时候,取其值就可以。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> ...原创 2019-07-22 16:13:58 · 14903 阅读 · 0 评论 -
webstorm vue require()懒加载路由 提示 invalid number of argument
invalid number of argument,expected 1解决方案:1、打开Webstorm,找到设置项2.依次如下找到相关项3.Signature mismatch后面的勾选去掉,保存。原创 2019-08-13 11:32:35 · 9008 阅读 · 8 评论 -
HTML 文本 图标 组合居中显示
<!DOCTYPE HTML><html><head><style>.dclass{width:100%;background-color:red;text-align:center;}.icon { display: inline-block; width: 20px; height: 20px; ...原创 2019-09-17 10:33:41 · 806 阅读 · 0 评论