基于dnd-kit实现Antd Table组件拖拽排序
背景 最近业务需求上要求对表格加入拖拽排序功能,由于我们UI组件库基于antd,根据组件库官方文档给出的基于react-dnd、react-sortable-hoc示例,与我们自身业务需求的调研,最后选择react-sortable-hoc…
React 组件生命周期
装载(首次实例化) constructor() static getDerivedStateFromProps() render() componentDidMount() 更新(组件已存在时的状态改变) static getDerivedStateFromProps…
文本域光标定位
在应用中某些场景下,我们会涉及到对表单元素与或者是带有属性的元素,设置自动获取焦点。在这些元素没有内容的情况下那么设置焦点非常容易,然而现实情况往往总是与众不同。那么在遇到这些需求我们该如何做呢? Input&TextArea Contenteditable
利用CANVAS生成缩略图
HTML CSS JS
表单元素复选框与单选框视觉优化
谈起表单元素在各浏览器上的表现形式,相信各位前端开发者与 UI 设计师都比较头疼,尤其是 checkBox、radio 以及 select 这三种表单元素展现各异。有时候我们为了效率不得不牺牲 UI 效果,那么有什么方法可以在保障效率的情况下,实现功能并达到与 UI…
CSS3自主义浏览器滚动条
由于平台不同,或用户采用的浏览器不同,或因同浏览器版本不同,都或多或少存在一定的差别,造成与 UI 设计图有一定的差别,影响用户视觉体验。那么目前这类问题常采用的方法都有那些嗯? 纯 CSS 样式 由 CSS 样式来定义浏览器滚动条涉及到几条 CSS…
元素居中排版
在前端开发切片布局中我们常常会遇到各种元素 水平、垂直、水平垂直居中显示的的场景,其中 水平居中 是相对简单,而 垂直居中则相应要麻烦些。 水平居中 对于行类元素如 span、label、em,small 等元素来说水平居中一般采用方式为:,的方式来解决。而块级如:div…
CSS3选择器之nth-child
在我们对一组相同元素作不同表现形式的操作时,在还没有选择器与时,我们常用到的方法可能是利用 JS 来控制表现形式,或者采用 CSS 选择器类处理这类问题。 我们需要在 HTML…
正则表达式
以下正则表达式均从各博客收集整理得来,目前还未作测试,请谨慎使用,若有错误麻烦各位及时反馈给我! 联系方式:whenhan@foxmail.com 正则工具 regexbuddy WEB 前端助手(FeHelper…