Vue3 + Vite 封装 Icon 组件
本文已参与「新人创作礼」活动，一起开启掘金创作之路。 在日常开发中，图标是大多数开发者都会有需求的，但在一个项目中，我们一般只引入一个 组件库，如 、 ，组件库提供的图标往往是有限的，并不能满足所有的需要。所以在本文中，介绍如何基于 二次封装一个 组件。 可以访问 80 多个流行的开源图标集，其中有超过 5000 个图标可供选择，基本上能满足了我们项目中的所有需求了。在 上，你可以查询到你想要的组件库图标并使用，如 、 。 安装依赖 首...
空值合并运算符??
空值合并运算符 空值合并操作符（??） 是一个逻辑操作符，当左侧的操作数为 或者 时，返回其右侧操作数，否则返回左侧操作数。 与逻辑或操作符（||）不同，逻辑或操作符会在左侧操作数为假值时返回右侧操作数。也就是说，如果使用 || 来为某些变量设置默认值，可能会遇到意料之外的行为。比如为假值（例如， 或 ）时。 使用空值合并操作符 在这个例子中，我们使用空值合并操作符为常量提供默认值，保证常量不为 null 或者 undefined。 为...
React-router6.x最新版本keepAlive解决方案
前言 笔者百无聊赖，把项目中的react router升级到最新版本来体验体验 令我惊讶的是，最新版本的router官网甚至连翻译都没有，也许是我没找到，官网还是全英的 因为项目中react是18，router又升级到了6.8这就导致了以前用的react router cache route不起作用了 于是笔者网上找了许久都没找到现成的解决方案，所以就只能自己边看文档边摸索了 最后算是解决了keepAlive，所以希望能帮助到遇到相同问...
slice()和splice()区别
1. (start,end)：方法可从已有数组中返回选定的元素，返回一个新数组，包含从start到end（不包含该元素）的数组元素。 注意：该方法不会改变原数组，而是返回一个子数组，如果想删除数组中的一段元素，应该使用Array.splice()方法。 start参数：必须，规定从何处开始选取，如果为负数，规定从数组尾部算起的位置， 1是指最后一个元素。 end参数：可选（如果该参数没有指定，那么切分的数组包含从start倒数组结束的所...
一款基于web的开源word文档编辑器
hi, 大家好, 我是徐小夕, 最近在研究基于 的文档编辑器,在网上调研了很多方案, 刚好看到了一款非常有意思的开源编辑器—— canvas editor , 它底层基于 实现, 我们使用它可以实现类似于 文档编辑器类似的效果, 同时还支持很多灵活可配置的 , 可以帮助我们定制属于自己的文档编辑平台, 如果你刚好也想着手实现, 这个项目将非常适合你. 同时, 作者是国内大佬, 欢迎点赞支持. 好了, 话不多说, 接下来我们看看它具体的使...
如何给网站安装百度统计代码
背景： 目前国内大部分网站都在网站添加了百度统计代码，用来统计网站的数据，例如网站的实习数据，来源，登陆页面，离开页面，停留时间等。如果你的网站希望能采集到这么详细的数据，并且网站服务器也在国内的话，可以在网站代码里面添加百度统计代码，然后进入百度统计的后台就可以查看到详细的网站运营指标数据。 操作步骤如下： 1、点击进入百度统计的官网， ： 2、注册一个账号，如果有百度的账号可以直接登陆： 3、登陆后添加网站： 操作路径，【管理】 【...
JS调用媒体设备失败 --- getUserMedia undefine 问题
解决: getUserMedia undefine 问题 问题: http请求的 chrome，edge, fireFox 等主流浏览器由于安全限制将不会暴露getUserMedia 方法，所以就不能够访问用户的媒体设备。 为什么会出现这种情况？ 首先本地开发 127.0.0.1 不会出现这种情况，这种情况仅存在于线上环境并且没有SSL证书的HTTP协议网址。 如何解决 1\. 使用HTTPS协议 为线上环境申请域名，配置SSL证书，实...
H5 下拉刷新如何实现
最近我需要做一个下拉刷新的功能，实现功能后我发现，它需要处理的情况还蛮多，于是我整理了这篇文章。 下图是我实现的效果，分为三步：开始下拉时，屏幕顶部会出现加载动画；加载过程中，屏幕顶部高度保持不变；加载完成后，加载动画隐藏。 首先我会讲解下拉的原理、根据原理写出初始代码；然后我会说明代码存在的缺陷、解决缺陷并做些额外优化；最后我会给出完整代码，并做一个总结。 下拉的原理 如图所示，蓝色框代表视口，绿色框代表容器，橙色框代表加载动画。最开...
h5调用手机摄像头踩坑
一般业务也很少接触摄像头，有也是现成的工具库扫个二维码。难得用一次，记录下踩坑。 2.1. 这个就不用多说了，缺点就是没办法自定义界面，它是调用的系统原生相机界面。 2.2. 由于我需要自定义界面，就像下面这样： 所以我选择了这个方案，这个 使用起来其实很简单： 可以看到这个效果。 如果你复制我的代码，在 上肯定能运行，但是你想在手机上试试的时候就会发现很多问题。 3.1. 需要 由于浏览器的安全设置，除了 和 连接，你都没办法获取到...