- 博客(23)
- 收藏
- 关注
RSS订阅原创 el-cascader、el-select打开或隐藏时抖动
因为里面的el-input的在动态的计算height，height在不停的变化导致看起来是在抖动。在最外层的将其超出的高隐藏。
2024-07-12 12:07:48
241
原创 el-cascader多选/单选数据不回显
但是不适用于我的项目上，在一点一点排查之后发现是切换单双选导致的数据不回显。这一行导致，所以就直接写两个组件用。
2024-06-28 16:00:35
646
原创 使用vue-draggable拖拽折叠面板时将面板都改为折叠状态
有这么一个需求，使用折叠面板进行分组展示，分组可以拖拽排序，由于分组的内容可能很长，拖拽过程展开的话会影响视觉效果，所以在拖拽的过程中将面板全部折叠。draggable组件又start方法，但是在这里折叠面板已经晚了，拖拽已经开始了。所以监听dom节点的原生@dragstart事件，在这里折叠面板。也是在拖拽的元素中，将不需要的元素display:none;1.在拖拽开始时，将el-collapse的所有面板折叠起来。2.拖拽的时候，元素应该只是折叠起来的面板，而不是展开的面板。
2024-01-16 15:01:36
645
1
原创 vue-seamless-scroll无法滚动
比如使用v-if、v-show进行判断的，在页面加载后没有显示。删掉后可能就会正确进行滚动，可以使用visible:hidden代替。首先，先检查样式，再检查配置，如果都没问题的话，看看在页面加载完成后，滚动区域是否显示在页面上。
2023-11-07 09:48:56
1279
原创 复杂表单设计
设计思路：降低用户负荷视觉负荷：在屏幕上识别和寻找信息；信息获取越轻松负荷越低。认知负荷：减少用户思考，甚至不用让用户思考，成为大脑潜意识认知的决策。动作负荷：减少交互可以降低动作负荷。心理负荷：有隐私、健康、财务、安全等。能更好的的阅读和理解比少一步简单操作更重要。设计技巧：降低视觉、认知负荷a. 信息录入先简单后复杂，先熟悉后陌生b. 先放必填基础信息，后放选填自定义信息c. 有前后逻辑关系视情况分布展示d. 信息能单列展示就不用多列(多列适用于字段之间关联性高
2022-05-16 11:37:38
453
原创 antd react 表单手动设置错误提示
使用**Form.create()**创建的表单antd是v3.26.19form.setFields({ [fieldName]: { value: '', // 设置出错之后field需要显示的值 errors: [{ message: '请勿输入xxxxxx' // 注意errors的格式 }] }
2022-03-26 16:49:00
4615
原创 MAC安装前端环境（系统10.14.6 Mojave）
写的是一个安装思路，具体的命令行可能需要自行百度，很简单就可以搜出来，我觉得重要的是思路。整理此文章也方便之后装环境。若之前安装过node，需要卸载干净。（怎么卸载，百度，选择适合自己的方法）终端输入ls -a查看～/下所有的文件，相关.nodexxx .npmxxx 都要删掉。按照以下顺序安装，比较稳。1.安装homebrew。/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/
2022-03-23 12:09:26
973
转载 谷歌浏览器“/deep/ combinator is no longer supported in CSS dynamic profile.“警告问题解决方法
谷歌浏览器“/deep/ combinator is no longer supported in CSS dynamic profile.“警告问题解决方法真滴有用！
2020-11-30 18:15:37
2160
原创 Vue生命周期及应该做的操作
此博是笔记记录，仅供参考beforeCreate实例化一个vue组件，但是数据 template都没有初始化和创建created初始化了数据，data method computed等，没有创建模板此时可以异步请求，但是展示不到dom中beforeMount创建了模板，但是没有挂在到真实DOM上，也就是没有编译，没有将data和真实dom绑定上mounted挂载到了真实的dom上，并且dom也渲染了，此时异步请求后数据可以展示在页面上了beforeUpdate真实dom上用到的数据才会
2020-11-30 00:58:21
286
原创 element-ui+vue-element-admin遇到的坑
element-ui+vue-element-admin遇到的坑在做后台项目的时候遇到的一些troubles(目前只停留在知道怎么解决的层面，后面有时间会去搞清楚原因，所以在此仅提供大家解决方法)Dialog中嵌套Tabs卡死试了网上搜的好多方法，最后只有一种方法生效的，那就是！安装vue-element-admin2.6.3版本(最新版本的2.12.0也是存在卡死的情况)使用$emit和$on通信失败$emit和$on约定的事件名称必须是小写的，驼峰命名不行，短横线命名法也不行
2020-11-07 18:44:21
632
原创 setAttribute()和setProperty()
setAttribute()和setProperty() 学习笔记初学习完setAttribute()和setProperty()后，在项目中使用时不太清楚原理，总是一知半解，最近又遇到关于这两个属性的笔试题，决定更加深入的去理解这两个属性(虽然也不是很深入)。setAttribue()关于“特性”Attribute和“属性”Property的了解可以看这位大佬的文章https://www...
2020-03-21 17:51:53
3980
1
原创 三栏布局之圣杯布局、双飞翼布局
文章都是自己平时的一些积累和感悟，若有问题，欢迎指出。一、圣杯布局圣杯布局和双飞翼布局是经典的三栏布局。实现了左右两侧固定中间自适应的布局。圣杯布局主要是利用float、相对定位、容器的padding来完成布局。<!DOCTYPE html><html><head> <meta http-equiv="Content-type" con...
2020-02-07 14:45:54
224
原创 js&jQuery 获取验证码
js获取验证码html <form id="form"> <input id="text" type="text" placeholder="请输入验证码" /> <input id="btn" type="button" onclick="getCode(this)" value="获取验证码" /> ...
2020-02-04 22:30:10
1442
原创 js 页面跳转并传参
方法一：window.open()（说在前面）window.open()跳转页面是打开一个新的窗口，这是与window.location的一个不同点。使用此方法跳转的新页面获取参数的办法是使用window.opener属性，指向原页面（跳转前）的window对象。最后调用你想用的数据。页面a跳转至页面b：<html lang="en"><head> <...
2020-02-02 23:31:29
7523
原创 背景图片background的一些常用设置
分享我在项目开发中用到的background的设置。 background-image: url();/*背景图片的url*/ background-repeat: no-repeat; background-size: cover;/*背景图基于容器大小伸缩*/ background-attachment: fixed;/*固定，不随其余部分滚动*/ ba...
2020-01-27 15:19:30
973
原创 登陆切换
js、html实现验证码登录与账号登录之间的切换 在近期的项目中遇到的一些有意思的点分享给大家。第一个就是关于验证码登录与账号登录之间的切换问题，我是直接去看了美团网的源码，发现实现其实实现的方式很简单。主要的方法就是定义两个表单。一个是验证码登录的表单A，一个是账号登陆的表单B。A的display值先为none，B为正常的值。再要切换登陆方式的时候，使用js将B的display值...
2019-12-19 23:52:53
1005
原创 实现两栏布局
几个实现两栏布局的方法（左侧固定，右侧自适应）一、position（定位）<!doctype html><html><head> <meta http-equiv="ContentType" content="text/html;charset=utf-8"> <title>两栏布局</title>...
2019-10-18 23:38:44
263
原创 美团头部导航栏实现
#纯CSS完成美团官网头部导航栏<!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8"> <title>西安美团网-西安美食_酒店_旅游_团购_电影_吃喝玩乐</title>...
2019-10-09 09:33:29
1942
3
原创 FCC TributePage
FCC Tribute Page要求：1.我的致敬页面应包含一个带有的元素id="main"，其中包含所有其他元素。2.我应该看到一个带有的元素id="title"，其中包含一个描述致敬页面主题的字符串（即文本）。3.我应该看到一个div带有的元素id="img-div"。4.在img-div元素中，我应该看到一个img带有的元素id="image"。5.在img-div元素内，我应该...
2019-10-06 20:20:57
471
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人