老电影故事-CSDN博客

刚刚说的更新element-ui，我cnpm安装后，好家伙，package.json是显示更新了，后面我看node_modules里面的element-ui的版本还是1.2.4，草，再看看官网1.2.4的插槽写法。接着我就去想，肯定是我的饿了么版本太低，才1.2.4，肯定太老了，于是我就。看了下package.json，版本是2.15.4了嗯更新了。我还看了上家公司的vue2项目的代码，也没毛病啊。我就把饿了么的demo在项目中跑起来看，卧槽。我惊呆了，从来就没这么写过。

2024-02-27 15:33:51 827

原创 Npm 淘宝镜像到期了，赶紧切换！！！

nrm 提供了一组命令，可以列出可用的 npm 源、添加新源、测试源的响应速度，并切换当前使用的源。其实，早在 2021 年，淘宝就发文称，npm 淘宝镜像已经从 registry.npm.taobao.org 切换到了 registry.npmmirror.com。众所周知，npm 官方镜像（registry.npmjs.org）在国内访问很慢，很多同学都会选择切换到国内的一些 npm 镜像，如淘宝镜像、腾讯云镜像。显示当前使用的源：当前正在使用的 npm 源的名称和 URL。

2024-01-31 14:10:11 4339

原创解决yarn报错 Error: certificate has expired ！

准备安装依赖yarn。

2024-01-31 10:33:21 768

原创 yarn报错 [1/4] Resolving packages... [2/4] Fetching package, error Error: certificate has expi

最终有效的解决方案：删除 yarn.lock 文件，重新执行 yarn install，成功了。删除运行目录下的 yarn.lock 文件。

2024-01-30 14:40:47 1944

原创封装Canvas图片压缩功能

要想更好的理解图片压缩，还是要把FileReader和canvas的一些api弄清楚，这样才会更加容易理解代码的逻辑，希望这篇文章能够帮助到各位大佬。

2024-01-29 10:33:46 1036

原创 React项目中引用本地图片的问题

我要点击的时候，显示一张图片。话不多说，直接上解决方法。

2024-01-22 10:20:19 502

原创日期选择器：The value/defaultValue of DatePicker or MonthPicker must be a moment object after `antd@2.0`

现在遇到的问题是，一个日期选择器，增加数据的时候，就是直接选择，编辑、查看数据的时候，就要给日期选择器直接赋值，后端返回的数据格式是 2023-12-29。这还算了，用的antd的版本是3.xxx,现在官网都更新到5.xx的版本了。目前在做一个后台管理的项目，祖传代码，React+ts+antd。于是干净回退到3.xx的版本，版本差异还是很大的。赋值是好了的特么现在选择日期的时候又不行了。好家伙，一堆报错，这怎么敢改，没那么多时间。好，我以为到这就好了，没想到喔测试下。一个后台管理用vue多好。

2023-12-29 15:16:39 1111

原创【常用字符大全】含emoji表情

❤❥웃유♋☮✌☏☢☠✔☑♚▲♪✈✞÷↑↓◆◇⊙■□△▽¿─│♥❣♂♀☿Ⓐ✍✉☣☤✘☒♛▼♫⌘☪≈←→◈◎☉★☆⊿※¡━┃♡ღツ☼☁❅♒✎©®™Σ✪✯☭➳卐√↖↗●◐Θ◤◥︻〖〗┄┆℃℉°✿ϟ☃☂✄¢€£∞✫★½✡×↙↘○◑⊕◣◢︼【】┅┇☽☾✚〓▂▃▄▅▆▇█▉▊▋▌▍▎▏↔↕☽☾の•▸◂▴▾┈┊①②③④⑤⑥⑦⑧⑨⑩ⅠⅡⅢⅣⅤⅥⅦⅧⅨⅩ㍿▓♨♛❖♓☪✙┉┋☹☺☻تヅツッシÜϡﭢ™℠℗©®♥❤❥❣❦❧♡۵웃유ღ♋♂♀☿☼☀☁☂☄☾☽❄☃☈⊙☉℃℉❅✺ϟ☇♤♧♡♢♠♣♥♦☜☞☝✍☚☛☟✌✽✾✿❁❃❋❀⚘☑✓✔√

2023-12-12 08:00:00 6879

原创 Common.js 和 ES6 Module 中模块引入的区别

自ES6起，引入了一套新的ES6 Module规范，在语言标准层面实现了模块功能，而且实现得相当简单，有望成为浏览器和服务器通用的模块解决方案。运行在浏览器端的javaScript由于也缺少类似的规范，在ES6出来之前，前端也实现了一套相同的模块规范（例如：AMD），用来对前端模块进行管理。这是因为ES6模块是在严格模式下执行的，而在严格模式下，全局对象的this值是undefined。在CommonJS和ES6模块系统中，this的指向确实有一些差异，这涉及到模块中代码执行上下文的不同。

2023-12-05 07:00:00 724

原创 van-list的onload事件多次触发的问题

这个问题的原因是当元素设置了 overflow-x: hidden 样式时，该元素的 overflow-y 会被浏览器设置为 auto，而不是默认值 visible，导致 List 无法正确地判断滚动容器。如果一次请求加载的数据条数较少，导致列表内容无法铺满当前屏幕，List 会继续触发 load 事件，直到内容铺满屏幕或数据全部加载完成。如图所示，页面刷新的时候，调了3次接口（总共27条数据，我分页10条），一直莫名奇妙的。原来是这个overFlow的问题！

2023-12-04 07:45:00 1813 3

原创浏览器兼容性问题及其解决方案

是指不同的浏览器对同一段代码有不同的解析，造成页面显示效果不统一的效果。即：同样的代码，在不同的浏览器上显示的页面效果不一样。

2023-11-28 19:51:01 4053

原创 ECMAScript2023你学习了吗？

此次发布的新方法不仅适用于常规的数组对象。此次公布的新方法正是toSorted、toReversed、toSpliced 和 with 都能复制原始数组、变更副本再返回结果。with 函数所代表的复制方法，等同于使用方括号表示方来更改数组内的一个元素。除了复制之外，sort 函数还会引发一些意想不到的行为，toSorted 也继承了这种特点。· sort() 非破坏性版本：toSorted(compareFn)· reverse() 的非破坏性版本：toReversed()注意：注册的符号不可作为。

2023-11-28 14:53:54 1005

原创听说还有人不知道如何实现水平垂直居中？

【代码】听说还有人不知道如何实现水平垂直居中？

2023-11-26 12:06:28 476

原创 css加载会造成阻塞吗？？

前几天面试问到了这个问题，当时这个答得不敢确定哈哈，虽然一面还是过了现在再分析下这个，总结下，等下次遇到就能自信得回答，666。

2023-11-26 08:00:00 1574

原创 react中间件的理解

其本质上一个函数，对store.dispatch方法进行了改造，在发出 Action和执行 Reducer这两步之间，添加了其他功能。redux-thunk中间件会判断你当前传进来的数据类型，如果是一个函数，将会给函数传入参数值（dispatch，getState）getState函数考虑到我们之后的一些操作需要依赖原来的状态，用于让我们可以获取之前的一些状态。Redux中，中间件就是放在就是在dispatch过程，在分发action进行拦截处理，如上图。，整个过程是一个同步的操作。

2023-11-14 23:16:42 757

原创逐帧动画demo

* steps(1) 是一种特定的时间函数，它表示动画将在每个关键帧之间离散地切换，就像一步一步前进一样。steps(1) 是一种特定的时间函数，它表示动画将在每个关键帧之间离散地切换，就像一步一步前进一样。/* 动画会在每个关键帧之间立即切换，而不会经过过渡动画 */动画会在每个关键帧之间立即切换，而不会经过过渡动画。用这一张图实现一个在跑的猎豹的动画。

2023-11-14 07:00:00 327

原创真正理解为什么要虚拟DOM

本质上就是一个js对象，用于描述视图的页面结构在vue中，每一个组件都有一个render函数，每个render函数都会返回一个虚拟DOM树，即每个组件都对应一棵虚拟DOM树。

2023-11-09 07:45:00 123

原创 IntersectionObserver的使用

是一个现代浏览器提供的 API，用于监听元素与其祖先元素或顶层文档视窗(viewport)交叉的情况，即元素是否进入或离开视窗。它通常用于实现懒加载图片、监听滚动事件、触发动画效果等场景，可以显著提高性能和用户体验。

2023-11-08 09:44:03 747 2

原创 JS 中的 Window.open() 用法详解

方法是 JavaScript 中的一个内置方法，用于在浏览器中打开一个新的窗口或标签页。需要注意的是，由于弹出窗口的滥用已经成为了一个安全问题，现代浏览器通常会默认阻止 window.open() 方法的调用，除非是在用户的交互下触发的。因此，在实际的开发中，我们需要谨慎使用这个方法，避免被浏览器误认为是恶意行为。

2023-11-07 07:30:00 1273

原创 webSocket推送太快导致前端渲染卡顿问题优化

把webSocket接收到的数据用一个数组存起来，达到一定长度再统一渲染，可根据推送数据的速度适当调解数组长度限制，如果一段时间内改数组长度打不要渲染条件，就用定时器之间渲染。

2023-11-02 18:25:23 2822

原创 React hooks的闭包陷阱

react特点，每次更新都会重新执行这个函数，每次就+1，是另外一个函数了，不是原来这个函数。子组件的 count 发生改变，我们在点击打印按钮，发现count 一直是0。但是setInterval的count永远是第一个函数里面的，形成了闭包。方法2 ：将获取 count 的方法创建到父组件，子组件调用父组件方法。说明此时的 useEffect 中的 count ，还是取的过期的值。点击一次按钮，发现页面是更新了，但是console还是上一次的值。需要，添加依赖项 count ，

2023-10-27 10:20:41 642

原创 vue中替换全局字体

产品说项目要拿去展会展示，但现在项目字体是微软雅黑，不支持商用，需要全局替换思源字体。

2023-10-26 07:00:00 1160

原创使用openlayers加载离线瓦片地图

我们现在的项目就说使用openlayer + geoServer自己发布的矢量地图，是和公安合作的项目，由于政府大都使用的是天地图，所以需要将geoServer的矢量地图改为天地图，搭配openlayers使用，openlayers还可以切换不同地图数据源，虽然文档不够友好。css的filter属性解释：大概就是改变你图片的色相，饱和度，黑白，通透性等等，来实现图片变色的效果。目的是解决加了这个函数后，有些瓦片不全时会加载404的瓦片图，缩放后就没了的问题。这里要替换你自己刚刚起的服务的地址哈！

2023-10-25 07:45:00 1348

原创总结使用React做过的一些优化

/ render函数的this已经被react做了修改// 这里的this就是指向当前组件实例console.log('父函数中的this指向为：', this)// 通过箭头函数的写法直接沿用父函数的this指向也ok这是我第一个类组件// 3. class field写法最推荐！！！！！

2023-10-24 11:17:46 431

原创跨域方案的抉择

遇到跨域问题的时候，到底是使用CORS来解决，还是使用代理呢？判断依据不是技术层面，而是你的生产环境。首先要关注的是生产环境里面到底是一种什么样的情况，到底有没有跨域，然后根据生产环境的情况，来决定开发环境到底使用什么样的方案。

2023-10-21 08:00:00 290

原创手把手教你如何新建一个vue3+electron项目

原生的窗口不好看，很难看。且无法去修改，导致满足不了UI的效果，所以很多桌面程序都是自定义窗口。这里主要是在main.js中创建窗口的时候加入。frame: false, // 不要自带的窗口})具体其它配置，可以看这里然后想实现一个这样的 DIY一个。

2023-10-20 08:00:00 3483

原创 React组件渲染和更新的过程

将reconciliation阶段进行任务拆分（commit无法拆分，dom渲染无法拆分）1、reconciliation阶段-------执行diff算法，纯JS计算。2、commit阶段--------将diff结果渲染DOM。同时再有DOM操作需求（动画、鼠标拖拽等），将卡顿。当组件足够复杂，组件更新时计算和渲染都压力大。React的patch可以被拆分为2个阶段。js是单线程，且和DOM渲染公用一个线程。（是React内部机制，开发者体会不到）DOM需要渲染时暂停，空闲时恢复。

2023-10-19 10:00:00 472