- 博客(25)
- 收藏
- 关注
RSS订阅原创 实现一个组织人员等的好用的树选择组件，给你想要的
树结构有它独有的优势，各大组件库也都对它有自己的实现，功能也是相当丰富，能满足绝大部分场景。但是也有一些时候，我们想要这样那样，感觉它不是很尽如人意。感觉不舒服那就要想办法，自己实现一个树，这样就可以完全自定义了，再结合上自己的一点小想法，做出来的组件用起来就舒服多了。既然决定了要自己重新做，那么就考虑一下工作内容，实现一个树组件起码得保证它具有一些基本功能，比如：① 支持层级展开收起功能② 支持树节点的多选功能③ 支持树节点的单选功能④ 支持父节点一键选中或取消所有，以及半勾选状态。
2024-02-18 10:23:55
1011
1
原创 利用js和css，页面如何实现禁止复制与禁止调试等限制操作
在我们开发系统的时候，可能会接到这样的需求：不要让用户复制页面上的文字或者图片，不要让用户调试我们的页面，更甚至也不要让用户进行打印操作等等。我们可以通过css来控制，也能够监听用户打开控制台的操作，从而达到我们想要的目的
2023-10-12 10:25:44
2459
原创 CSS之contain，一个连fixed定位都要看它眼色的限制属性
通过layout可以使得该元素的布局与元素外的任何内容相互独立，互不影响。即该元素所构成的容器从页面中隔离出来，单独计算布局。 通过paint可以限制该元素的绘制区域范围，子元素的渲染永远不会出现在容器外，容器的边界限定了子元素的可见内容。例如容器在屏幕外，那么就永远不用绘制，因为其子元素也肯定在屏幕外，不像margin负值放在屏幕外那样，子元素可能延伸到屏幕内
2023-09-26 09:49:46
444
原创 CKEditor5导入并解析word功能的集成，实现word转html
这是一个高级功能，虽然不是很常用，但是有一些特殊的场景或者需求，我们可能希望从编辑好的word中，通过导入的方式来让用户在网页中继续编辑它，并尽可能的保留内容和格式。用CKEditor5的导入word功能，把这个word导入到编辑器中，解析完成之后就看到了效果，它的还原度很高了，里边包含了段落、列表、图片、表格等等多个技术点
2023-09-19 09:20:33
1882
6
原创 CSS之font-size的说明与妙用
font-size用来设置页面的字号，他有很多种指定方式，像绝对值、相对值、长度值、百分比值、数学值、全局值。用它怎么设置比浏览器最小字号更小的字号，并能够让页面实际渲染出来？ 我的文字之间为什么有空隙，两个span标签不挨着，两个图片中间有空白条？
2023-09-18 09:55:40
5766
原创 页面可视化设计——用拖拽的方式搭建你的系统|点点更轻松
我们一直都致力于更好，无论对于个人、团队、公司来说，追求的点是各式各样的，像是低成本、高效率、可复用、易上手、易维护。我们使用可视化页面设计器，快速的完成了一个歌单页面的实现，我们通过数据视图、请求链接、执行寄连的设计理念，分步完成了它们各自的设计，整个过程简单、透明、方便...
2023-06-15 05:00:00
2024
1
原创 js使用一种方法搞定所有的字符串截取：突破substring的限制
字符串是最基本的数据类型，它有三种最常见的操作：拼接、分隔、截取。利用了重载的方式，我们根据不同的参数类型，进行了不同的处理，并且扩展了substring所不能支持的功能，我们实现了各种各样的字符串截取方式，使得我们对于字符串的操作更加灵活...
2023-06-08 05:45:00
308
原创 让你的系统支持git管理：使用isomorphic-git让数据库具备版本控制
我们日常开发工作中避免不了要使用代码管理工具，其中git是我们熟知的一种，通过isomorphic-git实现了从数据库到服务器到github的数据版本控制。并具备了初始化、添加、提交、同步、推送、拉取、信息配置、提交日志查看、文件日志查看、文件状态查看、配置信息查看...
2023-06-05 09:28:38
248
原创 mock数据可视化生成：动动鼠标就可以创建一个前端自己的接口
通过可视化mock数据生成器，模拟了一个接口返回值的数据集，操作简单、方便、快捷，在我们没有后端数据的情况下，可以自己来生成这样一份数据供我们调试。可视化操作不是我们的终极目标，它只是我们开发过程中的一个手段，或者说帮助我们作业的一个工具，通过它来解决绝大部分的问题就可以，降低成本，提高生产力。主要分为：操作区、分类区、辅助区、 属性区、数据区、展示区、帮助区、提示区、...
2023-05-28 06:15:00
480
原创 标签输入框tag-input：仿QQ邮箱来增强你的组件交互与界面展示
输入框的场景实在太多太多了，但我们偶尔也会碰到一些个性化的需求，今天给大家介绍的就是类似上面这样，可以显示标签的输入框。 先来假设一下我们的输入需求： 能对输入的内容进行校验、可以在任意位置插入新标签、可以拖动标签进行排序换位置、支持键盘快捷键操作、支持自定义插槽以丰富组件定制化...
2023-05-23 16:41:50
879
3
原创 js中this是什么，代表谁，详解看懂了却总碰到难以解释的现象？
虽然我们在日常开发中遇到this的难以理解的行为，可以通过各种方法去变相解决，但深入的去理解它的行为机制，有利于我们设计出更好的程序代码。我们不去说概念、说定义，也不用去背场景、背例子，更不会去长篇大论的深入展开，因为这些网上都是一大堆，而且跟记英语一样，没过几天就又蒙圈了。主要有：普通函数、箭头函数、构造函数、call/apply、bind、对象、类、事件处理这八种环境，不要被吓到，看着很多，其实只要牢记上面的口诀，一切都变的简单，它们都是一样的，其他的场景也
2023-05-15 02:42:04
333
原创 用CSS实现一个类似Element-plus的文字虚化效果
我们可能看到过这样的一个效果：页面中的内容滚动穿过某个固定元素时，会产生虚化的视觉效果，能看出文字的轮廓，但是却无法看到具体的内容，给人一种哎呦？不错哦的感觉。我们来拿element-plus官网作为案例，看看它是如何实现的，创造力是无穷的，就看谁的花样多！
2023-01-29 23:14:22
748
原创 F12-开发者工具常用操作与使用说明之网络network
发送请求已经是我们最基本最常见的需求了，而且我们也在频繁的接触它，但是我们经常会遇到各种各样的问题，有些错误很明显，我们直接就能定位问题所在，但是有一些问题总是让我们抓不到头脑，今天就来给大家讲解，或者说介绍一下关于网络面板的一些使用技巧，能够帮助我们快速排查定位问题，以至解决遇到的问题，启动器(Initiator)会展示出该请求的触发链路，即：该请求是由谁触发的，并且它的调用者是谁，以及更上层的调用者
2022-11-13 23:53:52
8623
4
原创 计算属性computed和侦听属性watch有什么区别？你会使用它们吗？
computed有缓存，是把该变量指向每次的执行结果，当响应式依赖变化时，vue会自动再次执行，而methods是把该变量指向函数，在用到的地方都会再次执行，而且当dom更新的时候，vue也会重新执行对应的方法，因此需要注意避免死循环，watch无所谓缓存不......
2022-08-29 10:20:25
1182
原创 F12-开发者工具常用操作与使用说明之源代码sources
我们可以关联本地的一个文件夹，当在内容区域修改该文件夹中的内容时，会同步修改磁盘中的文件，适合实时修改项目文件，并会直接同步到编辑器中，也可以使用本地中的文件替换当前页面中的文件，适合在调试过程中实时修改代码，但不会保存到磁盘中，还可以新建代码段，主要用来执行一些预置脚本代码，这样可以不用每次都编写同样的调试代码，直接执行相应的代码片段即可，而且......
2022-08-14 02:42:51
11595
原创 JS中的重载——如何实现一个类似这样的功能，我也想玩玩
在js中主要有以下几种实现重载的方式：1. 使用剩余参数的形式来接收可变的参数，并通过一些判断手段来处理不同情况的逻辑。2. 使用arguments的形式，来动态判断需要执行的操作3. 使用proxy的形式来拦截函数的行为，以达到控制不同的逻辑分支......
2022-08-07 10:11:30
458
原创 prototype是原型对象，那__proto__又是什么呢，总不能是别名吧？
prototype为函数特有属性，只有函数才具有原型属性，以供继承，对象也能继承主要是通过__proto__的连接__proto__表示一个对象指向它的构造函数的原型的指针，也就是说一个对象的__proto__指向它的构造函数的原型......
2022-08-01 00:54:41
441
原创 折磨人的Promise——你还能给我整什么新花样
可以说现在是promise遍天下，我们都知道JS分为同步任务和异步任务，而异步任务又分为宏任务和微任务。 宏任务总是在下次事件循环的开始后执行，微任务总是在本次事件循环阶段的结束前执行，如果不断......
2022-07-29 00:47:31
99
原创 CSS的众多小技巧之选择器：你还在为样式不生效而感到苦恼吗？
我写的样式老不生效啊，该怎么办呢？要不来个!important吧！改到最后发现随处都可见!important。你是否不知道如何选中需要设置样式的元素，也不知道怎么区间选择指定的元素列表？我来带你走近它们，轻松搞定遇到的问题......
2022-07-11 18:57:19
681
原创 JS的众多小技巧之高傲的正则表达式(RegExp)：你真能行
如果你对正则表达式望而却步，或者对它毫无头绪，不知道自己的需求场景是否适合使用正则表达式，那么我们接下来就去了解一下正则的一些特性，揭开它神秘的面纱，然后再回过头来看上面的例子，就会觉得一目了然，甚至不过如此......
2022-07-10 06:43:41
171
原创 JS的众多小技巧之神奇的toString：你啥也能
toString真是一个让我爱不释手的方法，虽然它的职能定位很简单也很清晰，但是有的时候总是老忍不住使用它应用在一些其他的场景中。那么它能做什么，能帮助我们简化或者解决哪些复杂的问题呢？能否利用这种方法，甚至可以在代码块级别的粒度上高度抽象出来复用性强、耦合度低、易维护的功能呢？下面就让我来为大家一一道来......
2022-07-08 03:31:59
237
原创 模拟浏览器限制并发请求数量-如何将大量请求利用补位机制发送
管中可窥豹，亦可窥花猫。我们都知道，浏览器在发送请求的时候，有最大并发数量的限制，无论更多或是更少，都会带来不同的利弊，那么从前端的技术角度触发，我们能不能来模拟实现一下自己的一套限制机智呢？通过回调与generator函数来实现一下吧......
2022-07-04 10:14:58
571
原创 monaco-editor浏览器中的网页代码编辑器在项目中集成
我们已经习惯了使用编辑器来编写代码，作为一名前端开发人员，有时候难免会遇到需要在浏览器中书写代码的场景。无论是用户需要还是我们自己为了开发便利，这都将是有益的。在网页中编辑很容易，但是能不能让我们像在本地编辑器中那样编写代码，提供丰富的功能呢？目前有很多个开源项目针对此问题实现了各自的一套解决方案。在此就以monaco-editor集成到vue项目中为例，为大家解决此类问题...
2022-06-15 18:54:51
3652
1
原创 F12-开发者工具常用操作与使用说明之控制台console
我们在开发的过程中，无论书写什么样的代码，构建什么样的项目，调试程序都是不可或缺的一步，如果能熟悉控制台提供的这些功能，并掌握一些操作的小技巧，那么将会极大的提高我们创作的质量与效率。......
2022-06-15 18:52:25
9991
原创 F12-开发者工具常用操作与使用说明之元素Elements
我们日常开发过程中经常会遇到不容易理解的行为出现，这个时候我们就要打开控制台（即开发者工具）来排查或解决我们的问题。元素面板提供的功能是非常强大的，其实还有很多便利性的功能，可以极大的帮助开发者快速发现问题、定位问题、排查问题、解决问题。甚至没有问题的时候也能够帮助开发者提升生产力。...
2022-06-15 18:49:00
3434
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人