- 博客(937)
- 收藏
- 关注
RSS订阅转载 Vue 父子组件钩子函数生命周期函数的执行顺序
父beforeDestroy -> 子beforeDestroy -> 子destroyed -> 父destroyed。父beforeUpdate -> 子beforeUpdate -> 子updated -> 父updated。子deactivated -> 父deactivated。子activated -> 父activated。子activated -> 父activated。
2024-06-28 10:30:05
27
原创 js 数字转汉字
方法一：使用数组和对象实现数字转汉字。方法三：使用正则表达式实现数字转汉字。方法二：使用递归实现数字转汉字。提示：AI自动生成，仅供参考。
2024-01-04 16:05:23
3443
2
转载 node.js及npm、vue等js类框架中@的用法
首先，“@”是一个符号，电子信箱中意义为“at”，即“某用户”在“某服务器”。好了，关于在前端nodejs中相关项目中经常出现的@符号就总结到此，还有哪些小编不知道的用法，还请博友在下面留言补充，以完善知识，利于学习之用。二、在npm中，与“/”相结合，置于包的名字前，表示该包的范围，即指示该包属于某个用户或组织，是该用户或组织提供的私有或公有包。三、node.js中，符合ES6标准的import命令中出现的@， 如。四、Vue的元素标签中，@”是指令“v-on”的缩写。
2023-09-10 18:51:25
947
转载 fs-extra: 替代Node.js内置fs模块，更安全、更强大的文件操作库
fs-extra 是作为替代 Node.js 内置 fs 模块创建的，当你的项目中引入 fs-extra 后，就可以像下面这样做。将所有使用改成在 fs-extra 内部，除了重新导出（re-exporting）内置 fs 模块的所有方法外，还增加了一些常用而且安全的方法，比如copy()remove()和mkdirs()。为什么？按作者的原话说：“我已经厌倦了在我大多数项目里都引入一遍mkdirprimraf和ncpmkdirprimraf和ncpmkdirp：用来创建目录，支持嵌套嵌套目录的创建。
2023-09-10 18:47:39
1807
转载 exit status 145: The directory is not empty及nvm切换node版本问题汇总
新进了一家公司，因为项目比较多，通常要求使用为12.13.0，偶尔会用到高版本，不升级版本安装依赖会报错。使用nvm升级出现了问题，网上乱说风云，解决不了我的问题，最后还是自己解决了。耐心看完，你的问题也会得到解决。翻译一下就是说：“老子只支持12.22.0或者14.17.0或者大于16版本,否则别想让老子给你装依赖”。没办法只能管着他了。安装新的node版本有两种方法：可以把原来的node直接卸载，去官网下载你要的版本。但是这样就不能动态管理了。
2023-09-10 18:39:30
423
转载 elementui 文本域el-textarea的计数限制不遮挡输入的文字
【代码】elementui 文本域el-textarea的计数限制不遮挡输入的文字。
2023-09-10 18:35:33
1487
转载 vue-cli项目postcss-preset-env配置不生效踩坑小记
前段日子根据公司的UI颜色规范(黑白板)整理了一套css变量提供给同事们使用，这样就不用每次写颜色的时候都要根据UI稿重复适配黑白板了，直接一个css变量搞定。平时也一定要注重积累，多去看看源码，原理性的东西，这样才不至于在排查问题的时候思维枯竭。上述问题确实是帮助同事一起排查了非常长的时间，搜索到的博客翻来翻去都差不多，所以决定自己写篇博客来记录一下这次踩坑，也能够帮助大家去排坑。针对上述问题，我们找了很多的资料，看了很多博客上别人提出来的解决办法最终都没有效果，就在我感觉快要放弃挣扎的时候，翻了翻。
2023-09-10 18:30:26
616
转载 移动端布局方案 postcss-pxtorem-postcss-preset-env
通过postcss-pxtorem来实现自动渲染px至rem的开发与生产工作而不需要再手动计算。
2023-09-10 18:21:45
259
转载 echarts实现横向和纵向滚动条、dataZoom及其滚动条设置
echart没有滚动条概念，有配置选项类似滚动条，通过手段模拟滚动条效果....省略很多字（难）
2023-09-10 18:12:59
21569
4
转载 解决echarts控制台警告：There is a chart instance already initialize on the dom
当我们把创建一个echarts图表的代码封装成一个方法，一旦多次调用这个方法创建图表的时候使用的dom节点都是同一个，每次都会init一个echarts实例，就会在控制台报如下警告:There is a chart instance already initialize on the dom（在dom上已经初始化了一个图表实例）。
2023-09-10 18:05:24
3963
转载 js - 模块化开发的兼容nodejs的exports的套路
我一直以为，在js中只有闭包有值引用。原来TM天天使用的对象的赋值也是值引用的，所以才需要克隆/深浅拷贝的概念。补充：除了第一种的套路，还可以这样使用第二种。都是用来自执行函数的。第二种的好处是，还可以返回一个true。是不是很奇怪一个闭包是怎么把变量Best暴漏到外部的？这是因为闭包传入的this。实际上是window。兼容套路1：适用于遵循CommonJs 、 AMD/CMD 的套路。另一个重要的知识点：对象的赋值，是值引用的。兼容套路3：第三方中学习过来的简单套路。兼容套路2：jquery的套路。
2023-09-10 17:59:26
125
转载 Vue3生命周期及当Vue3与Vue2生命周期混用时的执行顺序
同一个阶段的生命周期Vue3先执行，后执行vue2生命周期，然后再执行下一个阶段的生命周期。但是尽量别混用为好，vue2项目就都用vue2的生命周期，vue3项目就都用vue3的生命周期。Vue3生命周期及当Vue3与Vue2生命周期混用时的执行顺序_vue3在哪个生命周期发送请求_百思不得小李的博客-CSDN博客。
2023-09-10 17:48:09
383
转载 虚拟滚动-Vue 展示巨量数据，vue-virtual-scroller 使用说明 vue3 vue2
所有的操作都在官方 API 文档中有，我只是摘取了部分，哪里不太明白的话可以去看原文档。这是我做的另一个electron工具里的内容。
2023-09-10 17:45:18
2640
转载 vue.js - el-table-virtual-scroll实现虚拟滚动
基于Element-UI的Table 组件开发的虚拟滚动组件，支持动态高度，解决数据量大时滚动卡顿的问题。依赖：Vue2和ElementUI。
2023-09-10 17:41:48
1731
1
转载 使用vue-router切换页面时实现设置前进后退过渡动画_vue.js
今天在编写页面时,看到页面没有任何效果就只是直入直出,完全没有一点逼格,所以想要实现类似于原生app的那种切换页面时的特效,遂开始google,发现网上各种方案都是各有优缺点,于是整理了自认为优雅的方案并记录下来.我们需要给各个页面定义层级,在切换路由时判断用户是进入哪一层页面,如果用户进入更高层级那么做前进动画,如果用户退到低层级那么做后退动画.监控路由跳转,判断切换页面之间的层级关系,并以此来判断路由前进或者后退.每次切换时向左向右切换动画如何实现。如何判断切换路由时是前进还是后退。
2023-09-10 17:36:42
1462
转载 Vue中父组件如何能监听到子组件的生命周期
如果在组件外使用，就用父组件上加上@hook就可以达到上面的效果。通过监听子组件的生命周期函数来处理业务，例如监听子组件loading，数据渲染到页面的之前让页面 loading。的事件用来监听子组件的事件，只不过事件名和钩子函数同名，当子组件发布时，即执行this.$emit('钩子函数created/mounted',参数)时，在父组件则可以监听到，然后执行回调，使用参考下面的例子。原理：就是父子组件通信的基础上（方法1），添加@hook，形成了对应生命周期函数的自动发布，方法1每次都是手动执行发布。
2023-09-08 17:55:04
377
转载 用Vue编写抽象组件的方法
今天学习Vue源码时，看到抽象组件，以前用过，但是不知道叫抽象组件在Vue中，像这些都是内置的抽象组件，抽象组件和普通的组件类似，只是他们添加额外的行为，不向DOM呈现任何内容。有点像中的高阶组件当然我们也可以实现自己的抽象组件首先实现抽象组件，不用设置template，否则Vue会优先渲染tempplate里面的东西，就不能额外添加行为了实现自己的<debounce>抽象组件创建好组件后，使用的时候，和普通组价一样的使用方法局部使用。
2023-09-08 17:50:59
404
转载 Vue 3 | 函数式组件变形记
然而，在 Vue 3 中，常规组件的性能有了很大提升，相比之下，这时的函数式组件在性能上失去了以往的优势。因此，函数式组件仅剩的唯一用途就是用来实现简单组件了，比如一个动态生成不同标题的组件（市场被挤压，好可怜）。官方团队宣称，Vue 3 中函数式组件的性能提升微乎其微（与 Vue 2.x 相比），所以建议直接使用常规组件就好。因为函数式组件的初始化和渲染都很快（快过常规组件），所以通常作为一种提升性能的角色出现。函数式组件迁移到 Vue 3，直接把组件的。以创建函数式组件的方式也被废弃了。
2023-09-08 17:26:53
312
转载 vue函数式组件在项目中的使用
这里使用的template写法，vue底层执行的时候会将template解析成AST，然后将AST转化为render函数，render的过程vue帮我们处理就好了，所以不习惯写render函数的同学可以用template(用模板语法则该组件将不再是函数式组件，并拥有实例this)。如果你看过官方文档，了解过vue的组件化，会发现除了.vue结尾的单文件组件，vue还提供创建组件的另一种思路：Vue.component、Vue.Vue.extend可以当做Vue.component的组件选项。
2023-09-08 17:18:03
155
转载 Vue中provide和inject注入用法
使用场景：由于vue有$parent属性可以让子组件访问父组件。需要注意的是这里不论子组件有多深，只要调用了inject那么就可以注入provider中的数据。provider/inject：简单的来说就是在父组件中通过provider来提供变量，然后在子组件中通过inject来注入变量。使用方法：provide在父组件中返回要传给下级的数据，inject在需要使用这个数据的子辈组件或者孙辈等下级组件中注入数据。注意：provide并不是响应式的，当子组件inject的时候已经丢失了响应式功能。
2023-09-08 17:14:43
228
转载 Vue如何跨组件传递Slot的实现
在开发过程中遇到这样一个问题，如何跨组件传递插槽。因为在开发类似树组件的过程中，插槽需要通过外部传递到树的根节点，然后通过根节点依次传递到各个叶子节点。那么如何把根节点的Slot如传递给子组件呢?我们在开发过程中，希望可以这样实现重新定义叶子节点的结构：12345那么如何在组件内传递Slot就是一个问题。
2023-09-08 17:12:17
949
转载 Vue中的v-slot详解，作用域插槽和具名插槽
v-slot 指令自 Vue 2.6.0 起被引入，提供更好的支持 slot 和 slot-scope attribute 的 API 替代方案。v-slot 完整的由来参见这份 RFC。在接下来所有的 2.x 版本中 slot 和 slot-scope attribute 仍会被支持，但已经被官方废弃且不会出现在 Vue 3 中。Vue中的v-slot详解，作用域插槽和具名插槽_屈小康的博客-CSDN博客。
2023-09-08 17:09:03
863
转载 js粘贴监听事件获取excel内容或图片或HTML带样式的内容
经过一段小探索，完成了自己的需求，收获了三个关键字知识点：DOMParser。每个都值得好好挖掘~js粘贴监听事件_js监听粘贴事件_程序员阿明的博客-CSDN博客js粘贴板获取图片或HTML带样式的内容_前端黑猫的博客-CSDN博客IE 11粘贴仅适用于输入字段-腾讯云开发者社区-腾讯云javascript - 实践笔记：js解析剪切板里的excel内容 - I Dont know - SegmentFault 思否电脑关键字：粘贴事件。
2023-09-08 16:59:57
655
转载 npm 和 npx 有什么区别？
npx是一个工具，npm v5.2.0引入的一条命令（npx），一个npm包执行器，指在提高从npm注册表使用软件包时的体验 ，npm使得它非常容易地安装和管理托管在注册表上的依赖项，npx使得使用CLI工具和其他托管在注册表。就像npm极大地提升了我们安装和管理包依赖的体验，在npm的基础之上，npx让npm包中的命令行工具和其他可执行文件在使用上变得更加简单。是通过网址来共享代码。比如你想使用 jQuery，那么你点击 jQuery 网站上提供的链接就可以下载 jQuery，放到自己的网站上使用。
2023-09-08 16:50:18
66
转载 ffmpeg实现前端截取视频帧功能和实现web在线转码播放
有没有那么一种可能，在前端页面处理音视频？例如用户选择一个视频，然后支持他设置视频的任意一帧作为封面，就不用把整一个视频上传到后端处理了。支持mp4/mov/mkv/avi等文件。基本的思想是这样的：使用一个file input让用户选择一个视频文件，然后读取为ArrayBuffer，传给ffmpeg.wasm处理，处理完之后，输出rgb数据画到canvas上或者是转成base64当做img标签的src属性就形成图片了。
2023-09-08 16:30:46
1973
转载 vue项目使用@ffmpeg/ffmpeg在客户端上传本地视频并处理的开发记录
目前实现的功能：处理本地，线上URL视频，视频加水印，分离音频、截取下载某一帧图片，调整输出分辨率，导出到VOD或本地，替换视频背景音。浏览器版本请使用91，不要使用最新的，否则连测试都不行不支持safari浏览器！！！视频文件在操作过程中使用blob地址纯前端处理视频文件，由于文件是写在内存文件里面的，所以前端处理一些视频是没有问题的，项目最终结果差不多如下，只能处理小视频，上G的视频应该会很慢的而且机器内存可能满足不了需求。1、安装包2、页面上传方法功能vue页
2023-09-08 16:08:56
2370
转载 ffmpeg转码视频播放
MP4 = MPEG4文件使用H264视频编解码器和AAC音频编解码器WebM = WebM文件使用VP8视频编解码器和Vorbis音频编解码器Ogg = Ogg文件使用Theora视频编解码器和Vorbis音频编解码器当视频文件不支持video标签播放时需要将其格式用编码工具转化为支持的格式。本文是通过Java调用FFmpeg命令将MPEG编码格式转化为H264格式，当视频文件比较少时可以采用播放器软件(QQ影音就可以)来转。
2023-09-08 16:04:42
614
转载 移动端ios屏幕滚动时css样式filter属性发生抖动闪烁bug
安卓上一切正常，ios经测试下发现屏幕滚动时候出现抖动闪烁甚至空白的问题，百度谷歌百般求助无果，后来试了下给。个人理解是fliter属性会有一些transition动画，滑动的时候ios引擎渲染优化的不好。加了个overflow:hidden;属性万岁一切正常了。所以最终css改为如下就好了。
2023-09-07 16:14:39
394
转载 css中关于fit-content尺寸的属性
css体系中的尺寸，明显的表现就是元素的width和height了，另外就是因为display:inline-block、float:left和position:absolute的设置，导致元素尺寸收缩，比如position:absolute的设置。
2023-09-07 16:10:31
944
转载 css 布局display为flex,float失效
当父元素的display属性为flex时，以下几种属性会失效。3.text-align(文本排列)会失效。时，子元素float直接失效。1.float(浮动)会失效。2.clear(清除)会失效。父元素display 为。
2023-09-07 16:07:48
769
转载 css3 position定位sticky不生效的原因？
sticky属性依赖于用户的滚动，在 position:relative 与 position:fixed 定位之间切换。必须指定top、bottom、left、right4个值之一，否则只会处于相对定位。父元素不能overflow:hidden或者overflow:auto属性。父元素设置了overflow:hidden或者overflow:auto。元素定位表现为在跨越特定阈值前为相对定位，之后为固定定位。父元素的高度不能低于sticky元素的高度。父元素高度小于sticky定位的元素高度。
2023-09-07 16:05:25
434
转载 win11右键显示更多选项怎么关闭？
注册表编辑器是Windows系统内置的一个功能非常强的实用程序，我们可以通过它来查看和更改系统注册表程序设置，也能帮助我们轻松解决Win11右键显示更多选项怎么关问题，另外请注意，修改注册表编辑器存在一些风险，请仔细阅读以下流程并逐步操作，或者也可以提前对系统备份，以防意外情况发生。在新的Win11操作系统之中，微软为了美化界面，将右键菜单进行了整合更改，但是实用性却大幅度下降，引起了很多用户的反感，并迫切希望能够将Win11显示更多选项这个反人类的设置恢复成Win10的状态。
2023-09-07 16:00:00
1426
转载 Vue——vuedraggable拖拽组件使用文档总结
使用页脚槽在vuedraggable组件中添加不可拖动的元素。它应该与draggable选项一起使用，以标记draggable元素。请注意，无论页脚槽在模板中的位置如何，它都将始终添加到默认槽之后。组件中添加不可拖动的元素。它应该与draggable选项一起使用来标记draggable元素。请注意，无论标题槽在模板中的位置如何，它总是被添加到默认槽之前。定义一个json串 list，实现它的拖拽排序。
2023-09-07 13:49:37
2999
转载 js 多窗口同源页面间通信storage事件和跨域页面间通信postMessage
当同源页面的某个页面修改了,其余的同源页面只要注册了storage同一浏览器打开了两个同源页面其中一个网页修改了localStorage另一网页注册了storage事件注意：在同一个网页修改本地存储，又在同一个网页监听，这样是没有效果的允许同源的不同浏览器窗口，Tab 页，frame 或者iframe下的不同文档之间相互通信页面和其打开的新窗口的数据传递页面与嵌套的 iframe 消息传递多窗口之间消息传递语法。
2023-09-07 13:45:52
249
转载 JS之URL对象
比如，UTF-8 的操作系统上，http://www.example.com/q=春节这个 URL 之中，汉字“春节”不是 URL 的合法字符，所以被浏览器自动转成http://www.example.com/q=%E6%98%A5%E8%8A%82。），逗号（,），斜杠（/），问号（?），冒号（:），at（@），&，等号（=），加号（+），美元符号（$），井号（#）语义字符：a-z，A-Z，0-9，连词号（-），下划线（_），点（.），感叹号（!），波浪线（~），星号（*），单引号（’），圆括号（()）
2023-09-07 13:05:22
289
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人