- 博客(16)
- 收藏
- 关注
RSS订阅原创 使用 Promide 解决双重 for 循环嵌套异步请求导致的数据问题
Promise.all(promise).then(() => {//在Promise.all后进行后续操作，此案例为视图更新。在写项目时遇到，需要先通过双重循环后，一次去请求对应的接口，拿数据。研究后，决定使用 Primose 的方案解决。接口({id:a[i].b[j].id}).then((res) => {resolve()//此处 resolve，不需要返回数据。//用来接受这些请求。
2024-04-16 09:38:39
257
原创 vue el-cascader添加远程搜索方法
核心：1、使用before-filter，在此处编写处理的逻辑代码。3、@input.native使用input事件编写搜索框未输入需要展示的数据的逻辑。4、@change中编写，所选项清空时的逻辑。3、@change的方法（处理点击自带x标志删除所选项后的代码，与filterable联用时）//计算中文字节,原需求添加大于2个汉字时才发起搜索请求。1、:before-filter的方法代码。2、@input.native的方法代码。//此处编写搜索自负为空时的代码逻辑。placeholder="请选择"
2024-04-02 15:54:55
1434
1
原创 封装loading效果的vue全局自定义指令
前言：今天遇到个场景，接口较慢的场景，需要添加loading效果，查后发现原项目没有这部分代码，遂自己封装一个吧。import directive from '引入文件' // directive。一、需要写一个vue文件，写入loading效果的元素和样式，留一个入口判断显隐。import Loading from ' 引入loading的vue文件'三、找到项目中注册directive的地方，并引入文件后，注册。// 给父元素加个定位，让loading元素定位。// 控制loading组件显示。
2024-03-28 18:10:02
817
1
原创 element表单daterangeChange回显赋值之后重新选择，:rules校验相关不更新值的问题
/ 注意这里"value"的值不会及时改变，需要用到双向绑定的值，即"formData.timeDate"<el-form-item prop="timeDate" label="时间">"开始时间和结束时间间隔不得短于30分钟，不得超过24小时"callback(new Error("请选择时间"));"开始时间需要在当前时间的10分钟后且不能在6个月后"start-placeholder="开始时间"end-placeholder="结束时间"一、使用@input保证form表单数据更新。
2024-03-28 10:48:49
585
原创 element表单组件使用v-if控制item显隐时，表单校验不生效的问题
range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" format="yyyy-MM-dd HH:mm:ss"/>此处修改了v-if的条件之后，由显示变隐藏再使其显示，就出现了错误。输入了值以后还是一直提示未输入，尝试修改代码将v-if改成v-show之后突然发现可以了。aaa: [{ required: true, message: "请输入名称", trigger: "blur", }, ],
2023-11-08 08:59:46
1643
1
原创 将前端页面生成为pdf文件下载的处理方案及遇到的问题(html2canvas+jspdf)（html2canvas绘制textarea生成图片文字不换行的处理）
/由于html2canvas不支持textarea换行，此处执行this.changeStatus = true后将会替换原textarea元素为自写的div并复制textarea，下载完后会还原。此处我使用的版本为："html2canvas": "^1.4.1","jspdf": "^2.5.1",// 使用 html2canvas 库将 HTML 页面转换为 canvas 元素。// 将 canvas 元素转换为图像数据。// 将图像数据添加到 PDF 文档中。2）textarea样式的写法。
2023-11-02 16:35:42
1400
1
原创 el-tree树组件给节点赋值半选中状态的方法
if (node&&!node.checked) { // 此处应判断当前节点的checked属性是否为true，是则不必半选。const node = this.$refs.dept.getNode(节点的 key或 data)//获取节点。
2023-10-24 11:38:09
1394
原创 vue项目前端本地调试跨域问题-配置代理
具体使用 mac 时候是在终端输入open -a 'Google Chrome' --args --disable-web-security --user-data-dir=/xxx这个命令，会自动开启一个不检测跨域的浏览器窗口。在浏览器中打开请求时，本地调试的情况请求地址为 localhost:xxxx/api/...，代理会帮助我们将该请求转发给 target 后写入的地址请求，跨域问题就处理成功了。// axios中请求配置有baseURL选项，表示请求URL公共部分。
2023-10-16 09:46:54
661
1
原创 使用 react 脚手架启动项目时报错
devtools来方便查看react dom，这两个版本不匹配。本地使用的是v3版本的react-devtools,应匹配 v4 版本。于是在扩展程序中卸载，并重新安装 v4版的react-devtools即可使用。使用 react 脚手架启动项目时报错：react-refresh-runtime.development.js。原因是脚手架的版本为"react": "^17.0.1",在开发环境中使用到。
2023-10-07 10:49:53
230
1
原创 vue中的keep-alive用法总结
今天刚好接到任务，给全局页面添加缓存，目的是跳转新组件后还可以记住上一组件的操作，减少性能消耗。4、通过为 router的 meta 添加属性，使用 v-if 判断该属性所在的页面。// 1. 将缓存 name 为 条件 a 的组件,如果有多个，可用逗号分。include= '条件a' (仅为 ’条件 a‘ 的组件添加缓存）exclude='条件b' (为除了 ’条件 b‘ 的组件添加缓存）// 2. 将不缓存 name 为 条件 a 的组件。
2023-09-14 15:02:22
337
1
原创 当某一段代码必须在多个异步接口调用结束后才能执行时，出现的数据值不安全的问题
解决方案，写一个 promise，将代码放在之后执行。//在全部拿到接口ABC之后才能执行的方法。this.接口A(),
2023-09-06 18:10:00
116
1
原创 el-upload覆盖原始的上传action，转为写http-request的形式
2、http-request的方法需要传入row 的数值。遇到的问题：1、不使用action时，action 属性不能省略。方法：可传入 row 的值。
2023-08-23 17:28:23
271
原创 vue2 中由于赋值后新数组和旧数组的长度一样导致响应式未触发踩坑
今日在修改离职同事的代码时突然发现了个 bug，场景是已经确认成功给数组赋值后，视图仍显示赋值前的数组的值。于是尝试使用 this.$forceUpdate()强制刷新，依然未成功。后采用赋值前先将数组置为空数组，再进行赋值，发现成功更新。方案 ：将数组置为空数组或将数组长度置为 0 后，再进行赋值。
2023-08-09 14:06:31
230
原创 vue2子组件未监听到父组件数值变化踩坑
修改方案：或者将父组件中数据的改变用JSON.parse(JSON.stringify(data))进行转化，子组件即可监测到数据变化。但是父组件数据动态改变时，子组件却接收不到最新变化的数据, 响应式原理失效。deep: true //监听对象或数组的时候，要用到深度监听。immediate: true, // 立即生效。父子组件传值使用props，数据类型为对象。//省略视图更新逻辑。
2023-07-24 11:03:23
1308
原创 vue中，form表单内只有一个input按回车键时，@keyup.enter.native事件不生效踩坑
el-input v-model="form.code" placeholder="请输入code"<el-input v-model="form.code" placeholder="请输入code"问题:@keyup.enter.native外部存在form表单，并且form表单里只有一个input。修改后：此时输入框输入后按回车键即会执行codeVerify方法。原因：当form表单内只有一个input按回车键会自动提交表单。原：此时输入框输入后按回车键不会执行codeVerify方法。
2023-07-10 14:24:30
1140
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人