三水木雨-CSDN博客

原创 js方法提前结束循环

对于forEach()方法，目前似乎没有比较优雅的跳出整个循环的方法，如果你实在要用forEach()方法并且需要在某种条件下跳出整个循环提高遍历效率，可以考虑使用抛出异常的方式：trow。

2024-02-29 23:59:39 252

原创 vue3项目下载@element-plus/icons-vue哭笑不得的乌龙

虽然我再次查看pnpm版本的时候还是8.0.0，但是版本问题已经不妨碍我下载 @element-plus/icons-vue了。重点来了：本来就只要执行一句命令就能解决的问题，我一个不注意花了三个钟头来研究问题。最后再次执行pnpm install @element-plus/icons-vue。用命令下载@element-plus/icons-vue的时候，报错并提醒如图。他们应该是“pnpm add -g pnpm to update”。npm版本：8.19.4。pnpm版本：8.0.0。

2024-01-31 22:52:48 668

原创 VS Code实现“Ctr+save”保存代码自动格式化

【4】试试看，Ctr+save保存之后有没有自动格式化，没有就关闭VS Code重启一下。【1】打开文件——首选项——设置或者左下角齿轮打开设置。（意思是默认格式化设置），接着下拉选中刚下好的插件名称。【2】搜索设置框输入。

2023-12-23 22:49:05 901

原创 Vue2和Vue3组件间通信方式汇总（3）------$bus

组件间通信方式是前端必不可少的知识点，前端开发经常会遇到组件间通信的情况，而且也是前端开发面试常问的知识点之一。接下来开始组件间通信方式第三弹------$bus,并讲讲分别在Vue2、Vue3中的表现。

2023-12-23 12:05:05 887

原创 Vue2和Vue3组件间通信方式汇总（2）------$emit

两种接收（绑定事件）方式一种：自定义事件：@child="father"形式 ,当然原生事件的修饰也可以用在自定义事件上：once\prevent\stop\capture\self\passive；另一种：ref, this.$refs.child.$on("child",对应父组件方式this.father)，当然$on也可以换成其他绑定指令如：$once。第一种：用自定义事件的方式接受子组件的调用。

2023-12-23 11:41:12 1011

原创 pnpm ：无法加载文件 D:\nodejs\node_global\pnpm.ps1，因为在此系统上禁止运行脚本

遇到的问题是运行pnpm install命令时出现的，这是因为Power Shell的执行策略限制了脚本的执行。为了解决这个问题，需要更改Power Shell的执行策略。：允许运行未经签名的脚本，但是必须由受信任的发布者在本地计算机上签名。：只允许运行经由数字签名并由受信任的发布者签名的脚本。：默认策略，禁止运行任何脚本，除非明确允许。：允许运行所有脚本。

2023-12-20 22:35:22 3009 1

原创 Vue2和Vue3组件间通信方式汇总（1）------props

props可以传数组也可以传对象，详情可以到Vue官网查看入门手册。控制台显示结果：儿子：爸爸！爸爸：hello，儿子！控制台展示结果：儿子：爸爸！爸爸：hello，儿子！页面最终结果展示：儿子，我是爸爸，页面展示的结果：爸爸！

2023-12-20 21:11:40 549 1

原创关于el-table+el-input+el-propover的封装

在实现单选功能过程中，运用selection-change会发生反复触发以及反复调用函数的情况，就是通过api,clearSlection()和toggleRowSelection()改变的勾选状态也会触发selection-change绑定的方法。4、勾选数据后，因为分页过多，原先选好的数据容易被埋没，在el-input里手动删除或添加触发input事件，el-table根据原有数据能检索到对应数据。5、若不通过勾选选择信息，手动添加，触发input事件，可一边输入一边检索是否存在所输入的数据。

2023-11-11 19:06:21 1094 2

原创前端面试题

二者不同的是，call()参数列表一次性传入，而bind()可以分多次传入。M是model，是指数据层，V是view，是指前端试图展示层，VM是vue是链接数据层和试图展示层的桥梁，是实现数据双向绑定的业务逻辑代码层。

2023-11-01 17:58:48 120

原创项目添加以vue为后缀名的vue文件，怎么解析打包

也就是说，14版本之后下载veu-loader,另外还要下载一个与之配套的插件，或者改成13以上14以下的版本：^13.0.0。下载完之后，你以为就完事了吗？来带你看看你以为一切安好，npm runbuild打包之后的样子。

2023-10-20 11:21:14 381

原创如何通过Photoshop将视频转换成GIF图片

不要怕，大概率是因为你的视频文件导出的时候文件过大，因此需要你裁剪视频帧数以减小文件大小。6、编辑完之后，文件——导出——存储为web所用格式。2、写CSDN无法上传视频，而可以用GID动图替代。4、配置视频信息，按照图片提示配置完毕之后，等待。2、点击文件——导入——视频帧到图层。1、打开Photoshop APP。8、最后点击存储，选择存储文件。1、将视频转有趣动图发朋友圈。5、按照自己喜好编辑图片。7、配置图片文件格式。

2023-10-15 23:34:50 897

原创 div盒子放在页面正中间，添加旋转动画的时候，盒子向右下偏移

animation中添加的过渡中 transform: rotate(0deg);将原本设置的定位 transform: translate(-50%, -50%);第二种方法、@keyframes种同时加上 transform: translate(-50%, -50%);第一种、在该盒子上面再添加一个盒子，把animation以外的属性添加在外一层的盒子中。//盒子定位在页面正中心。

2023-10-15 22:53:55 359

原创 vh、vw、vmin、vmax

百分比时基于父元素的长宽，而vh\vw\vmin\vmax基于屏幕可见视图的长或者宽。vmin:vh和vw之间选较小的值，vmax:vh和vw之间选较大的值。vh:指屏幕可见视窗的高，vw:指屏幕可见视窗的宽，

2023-10-15 22:32:25 596

原创 Vue中props报错或问题解决

措施：如果prop中的"inputUserData"接收的是初始值，将要对其加工，可以放在计算属性中进行加工，或者放到另一字段比如“"inputUserDataCopy”接收"inputUserData"值，然后直接对"inputUserDataCopy"进行操作。在子组件中，"inputUserData"这个值放在v-model属性中，存在被修改覆盖的风险，后者存在其他被修改的可能，比如调用某个方法把"inputUserData"里的值改了，解决：把data属性中的"inputUserData"删掉。

2023-09-26 20:00:46 778

原创谈谈BFC

2、两个标准流（或者同时添加float:left浮动）盒子添加margin属性，距离不是两个值之和而是较大值作为两个盒子的距离。1、两个标准流（或者同时添加float:left浮动）盒子添加margin属性，距离不是两个值之和而是较大值作为两个盒子的距离。6、父盒子添加BFC，直系子盒子也添加BFC，该子盒子还是会收到父盒子的影响，但是子盒子里的孙盒子不会再受到爷爷盒子的影响了。盒子分为标准流盒子和非标准流盒子（浮动、定位），添加BFC后的盒子是标准流的盒子。5、父盒子会将浮动的子盒子的高度参与计算。

2023-09-25 01:28:06 91

原创 JWT令牌

因为HTTP是无状态的网络协议，比如，一套系统势必会存在很多次请求，而你的每一次请求服务器都不知道一个个请求是你发送的还是别人发送的，就会造成你已经登录成功进入页面搜索某个东西点击确认发送了一个搜索数据的请求，然而服务器已经不记得你是谁、是否登录成功，然后听都不听你的请求就被服务器关在门外了，因此你的每一次亲求都要进行一次身份验证，但总不能每发送一次请求都要输入一遍账户密码来验证你是具备请求权限的吧？只需要解密就可以直接获得用户信息数据，而不用再取数据库查询数据了，简单的查询还好就怕复杂数据地查询。

2023-09-21 21:36:10 113

原创 Navicat破解版本，报错‘No All Pattern Found!File AlreadyPatched‘或者报错‘Rsa Public Key Find‘可能出现的原因

解决：1、断网2、关闭杀毒程序。

2023-09-01 20:05:14 5050

原创 Vue.js知识点学习的一点笔记

vue.js渐进式框架有个虚拟DOM的概念，运用diff算法，比较新旧数据，相同的数据不变不重渲染，不同的部分新数据覆盖旧数据。3、Vue封装了一个递归查询，可以找出对象嵌套多层中的对象，并为之添加setter和getter方法，直到最后不是对象类型的数据为止，如数组、字符串、数字、Boolean、null、undefined等等。3、计算属性中有getter方法和setter方法，当只有getter方法，没有setter方法的时候，计算属性可以简写，写在插值语法中的方法名可以不带括号。

2023-08-21 14:38:28 371

原创 JavaScript对象知识总结

3、Object.create()创建对象。2、形如：obj[key]=value。1、形如：obj.key=value。1、属性键和属性值一样，简写成一个，2、new关键字＋构造函数创建对象。1、获取方法：setter。2、设置方法：getter。2、对象中的方法简写。

2023-08-19 16:28:55 130

原创 css3新增选择器总结

有详细示例地讲解有关“属性选择器、结构伪类选择器、伪元素选择器、UI状态伪类选择器、反选伪类选择器、target选择器、级元素通用选择器、父亲选择器、后代选择器、相邻兄弟选择器、兄弟们选择器”选择器。

2023-08-13 21:19:18 905

原创 element表格+表单+表单验证结合运用

点击添加按钮，首先验证表单，如果存在没填的就验证提醒，都填了就向下添加一行表单表格；table中放form表单，放输入框或下拉框或多选框等；点击当前行删除按钮，清除行。

2023-08-04 15:43:59 2359

原创 uni-app之微信小程序实现‘下载+保存至本地+预览’功能

代码打包编译在微信开发者工具，调得通，手机（ios\安卓）真机调试也能调通，但是，PC端微信小程序真机调试的时候，能保存但是预览失败。uni.downloadFile()+uni.openDocument() —— 预览临时文件下的文件（仅保存在tmp文件夹）；3、同样的代码运行在微信开发者工具上，代码变化且报错，那是因为链接并非本地页面而是远程服务获取的图片链接。1、下载(缓存，是个临时文件，未保存)：uni.downloadFile()—— 预览长久文件下的文件（仅保存在store文件夹）。

2023-07-27 18:13:54 9797 4

原创 el-table组件插槽“slot-scope”

1、返回的数据checklistList（数组）当中，每行都不含字段ispass和value时，往scope.row.value和scope.row.value 中输入值并提交，得到的每行都有ispass和value字段的数组对象。

2023-07-19 15:38:19 1717

原创 [Vue warn]: Invalid prop: type check failed for prop “value“. Expected String, Number, got Array

3、也就是说，uni-data-select下拉组件获取绑定的数据类型是字符串类型或者数字类型。如果初始化成数组、对象、Boolean等之外的类型，就会报类似的错误。1、意思时检查到"value"相关的值有误，希望它时字符串类型或者数字类型，而不是数组类型。1、在uni-app小程序中应用到uni-data-select组件时，出现的报错。

2023-07-15 11:04:02 6282

原创 [Vue warn]: Error in v-on handler: “TypeError: Cannot read properties of undefined (reading ‘open‘)“

使用该代码时，报[Vue warn]: Error in v-on handler: "TypeError: Cannot read properties of undefined (reading 'open')"的错误，表示“找不到open这个元素，无法解析这串代码”。标签放在了被遍历实行的uni-card组件当中，因此，uni-popup组件也被遍历执行了N次，所以用。在做uni-app的过程中有使用到uni-popup弹出层组件。

2023-07-13 17:13:09 6861

原创 JS获取盒子定位或宽高的方法，你知道几个？

offsetHeight=盒子高+padding值+border值+横向滚动条宽。offsetWidth=盒子宽+padding值+border值+纵向滚动条宽。outerHeight=盒子高+padding值+border值+滚动条宽。outerWidth=盒子宽+padding值+border值+滚动条宽。)=盒子宽+padding值+border值+margin值+滚动条宽。)=盒子高+padding值+border值+margin值+滚动条宽。scrollHeight=盒子的高+padding值。

2023-07-04 11:36:25 1662

原创 vue项目中把文件放到静态资源中，a标签做下载功能路径出错的根本原因

【1】public被webpack打包，不变，一开始是什么样子，组后还是什么样子【2】assets被webpack打包，会变成base64或者fallbac格式的文件。

2023-04-10 17:14:48 1759 1

原创用来判断数据类型的两个方法

复杂数据类型：对象、数组。

2023-03-23 10:46:53 283

原创路由传参——刷新页面会数据丢失

但是用到this.$route.query.ObjectData的页面，刷新后会导致this.$route.query.ObjectData数据丢失。【2】传递对象，或者含有对象的数组，在传之前先把数据转换成字符串再进行传递--》JSON.stringify()，获取的时候把字符串转换成对象--》JSON.parse()当index页面刷新之后，再打印 this.$route.query.ObjectData，会得到一个[Object Object] 未知数据，导致报错！

2023-03-06 11:59:24 1835

原创 js函数声明方式2，对象声明方式7，不同的调用

fu2（‘你看我几分像从前’，‘眼里透露着清澈的愚蠢’） //你看我几分像从前眼里透露着清澈的愚蠢。test.prototype.属性名=value1。test.prototype.方法名=value2。test.prototype.方法名=匿名函数。test.prototype.属性名=属性值。【2】new操作符+Object声明对象。this.属性名=value1；this.属性名=value1；【7】class类方式声明对象。obj.属性名=属性值；【3】构造函数声明对象。

2023-02-24 20:19:45 593

原创 localStorage和sessionStorage

localStorage生命周期：除非你有意删除localStorage中的数据，或者浏览器卸载重新安装，里面的数据一直存在。刷新也好，切换浏览地址也好，关闭浏览器也好数据都是不会丢失的。由于他们自身不同的特性，使用场景是不一样的。1.存值共有3种方式，localStorage相当于window对象下面的一个属性，所以有[]和.调用，但也具有自身的setItem方法。3.改变的方式，就是相当于给对应的key重新赋值，就会把原来的值覆盖掉。转为字符串，拿数组、对象数据的时候，用。5.获取所有的key。

2023-02-24 19:16:40 3407

原创 vue项目引用echarts，点击图表打印的数据，v-model捕获不到

1】vue项目2】echarts散点图3】点击散点图各个散点，获取对应散点的全部信息4】获取到的信息，通过v-model应用到element组件中，动态展示获取的散点数据。

2023-02-13 17:19:45 325 1

原创 el-table+selet+pagination回显触发selection-change事件，打印的数组出现数据重复问题

1】vue项目2】el-conversation组件3】使用el-table组件4】使用type="select"属性5】使用selection-change事件6】使用toggleRowSelection方法7】混合使用el-pagination组件。

2023-02-13 16:37:19 3213

原创 “TypeError: Cannot read properties of null (reading ‘getContext‘)“

第一次在vue项目种使用canvas，跟着网上教程做，标签canvas写好了，dom元素获取了，简单“画”了一下，运行之后报"TypeError: Cannot read properties of null (reading 'getContext')"的错。：在模板渲染成html后调用，通常初始化页面完成后，再对html的dom节点进行一些需要的操作。：在模板渲染成html前调用，即通常初始化某些属性值，然后再渲染成识图。显然，获取dom元素，作图都没有错。canvas元素在页面加载之前就获取了元素。

2023-02-10 16:33:07 12340 1

空空如也

空空如也