- 博客(25)
- 收藏
- 关注
RSS订阅原创 一篇文章说明白el-table的树形数据和懒加载,编辑,删除的局部更新
此时的这个row就会有parentId,我们只要拿到parentId我们就可以从我们存储的Map中拿到load的参数,从而重新加载load函数。大体的逻辑就是我们在更新懒加载的table时,我们只需要更新load这个函数就可以了,这就是叫局部更新,而且也不会刷新页面,用户体验较好.row-key : 这个尤为关键,当我们懒加载时所绑定的row-keys绝对不能重复,如果后端出现重复的情况,那就需要我们前端进行生成。编辑的话,大家的业务不一样,涉及组件的传值,大家自行书写即可,我这边说一下删除的。
2024-05-04 11:09:24
811
原创 使用window.open一次性打开多个标签页
使用window.open 打开多个标签页，浏览器默认是禁止该行为的，浏览器会认为是广告等就会拦截。
2024-03-31 09:31:45
655
原创 深入探索 window.addEventListener(‘storage‘) 事件
我们项目中如果token存到localStorage中，并且会有权限的功能，那就需要根据以上的描述并结合自己的项目会不会存在这种情况的发生。
2024-03-30 16:23:01
1232
原创 利用原生scroll，进行下拉刷新
我们需要从原生DOM对象中结构scrollTop, scrollHeight, clientHeight这三个参数。loadingType是用来判断，如果是初次加载此接口则不需要合并数组，滚动分页请求的则需求合并数组。所以scrollHeight = 我们所有class="main_item"的高度之和。我们打印出来最新的log中scrollTop的值正好是200。所以我们现在理解scrollTop的定义大家应该就理解了。大家可以根据以上的代码进行适当的拓展，根据业务需求来定。
2024-03-10 11:08:07
322
原创 浏览器通知Notification Api的使用
实现的效果如下：不同的浏览器，不同的PC设备显示的样式各有千秋。windows：chrome浏览器windows:360极速浏览器MacOs：Chrome浏览器。
2024-02-25 09:21:08
1193
1
原创 Vue 带参数的动态路由
此时的问题是，编辑页面无数据，原因是id为undefined，详情接口无数据，因为我们id是列表中获取的，当前的操作并没有点击列表，所以id为undefined。解决方案：我们在路由上增加动态参数，id，我们页面跳转的时候是不会刷新地址栏的，所以我们在编辑页面，按照往常获取路由参数就行。CRUD很常做吧，比如，新增和编辑时新开一个页面进行操作，编辑呢，我们需要根据列表id，查询详情接口，回显编辑页面。从第一张图片定义的路由后面跟着id，我跳转路由的时候携带的参数如果key是id的话，就会映射到地址栏上。
2024-01-28 11:20:12
406
原创 el-tree 勾选a节点之后b节点才能勾选，否则禁用
不知道大家有没有遇到过yue的需求哦。先看下效果的视频url下面会围绕着订单修改节点和COD修改的节点展开，所以我亲切的称为a节点，b节点哈。需求说明，b节点默认是禁用的，当我勾选a节点的时候，b节点才能勾选，当我可以勾选b节点的时候，这时我把a节点取消勾选，理当b节点的选中状态也应取消，交互就是这样，接下来，我说思路哈。后端返回的数据已经是树结构的了，所以我这边就不做处理了。每一个item对象里面都有一个resourceCode ，可以理解为唯一标识。
2024-01-01 20:42:08
407
原创 使用vue自定义指令，实现按钮级别权限
本文涉及的功能涵盖，登录权限管理，vue指令，模块化。但是登录注册的模块，本章会一概而括，具体功能会根据需求而开发。本文只是提供一种思路，毕竟每个功能都会有参差。
2023-10-03 20:26:34
1281
1
原创 使用canvas生成二维码，并实现下载图片。
（仅限于二维码是前端生成的哦，后端直接返回给你的长链接的话，请大佬们自觉略过）。toDataURL：canvas的原生方法，现在是转成png的格式，所以后面的参数为‘img/png’需求描述：根据后端返回的code，前端进行生成二维码，并实现下载的功能。到这，生成二维码的功能就可以了，根据需求场景自己去定义，封装就可以了。第三个参数，可以设置他的样式，但是也可以在style里面也是一样的效果。用到的第三方工具，qrcode，一个专业的二维码生成工具。第一个参数，是获取的canvas的DOM元素。
2023-06-23 17:26:34
1584
1
原创 还在使用onInput 控制input控件输入方式？
这几天有遇到这么个问题，很平常的需求哈，就是我们输入框只能输入数字，不能输入字母或者其他的特殊字符，这还是比较常见的操作哈，然后那天提测前我自测了一下，发现有个问题比如说我们现在的el-input使用oninput的属性利用replace的方法进行替换，就会发现，如果在中文的情况下输入，虽然这个输入框限制了你输入的文字，但是当我再次输入数字的时候就会发现，el-form的校验并不会校验成功，但是明明输入框中是有数字的。那我们就另辟蹊径换一种写法呗，我们可以使用@input的方法，就可以完美的解决问题。
2023-06-23 16:51:38
211
1
原创 前端通过【bitly】Api，将长链接转换短连接
但是呢，有个前提呢，是需要去注册，然后bitly官方会给你生成一个token，把这个token作为请求头，发给官方，当得知这一点之后哈，我就马不停蹄的去跟产品说，让他立马去申请的哈。策略模式的写法真的会比较的简洁，并且美观，很容易维护，所以还在用if else switch的同学，不防去了解一下哈，前端工程嘛，还需要我们砥砺前行。有一点需要说明的就是，data中的参数问题，有些需要根据自己的业务，调整，不要心急，刚开始也是调不通，后来调试好之后就可以了。除此之外呢，我们还需要做一个复制的功能哈。
2023-04-30 15:59:43
942
原创 策略模式替代ifelse进行判断优化
策略模式用大白话的说法就是,把需要做的逻辑,枚举等一些,定义一个方法,去调用。我会大体去分享一下项目中哪些场景区使用。
2023-02-15 20:53:23
918
原创 工作中常用的Git命令
Git 现在作为工作中主流的版本控制系统，同时它也是个内容管理系统(CMS)，工作管理系统等的。所以在这里对于Git的介绍我就不赘述过多了。所以我在工作中常用的Git命令在这里我会分享给大家。
2022-12-03 20:54:32
314
原创 el-table-column 嵌套 el-autocomplete中修改样式宽度
解决el-table-column嵌套el-autocomplete 下拉框的宽度自适应
2022-07-19 14:20:45
1198
1
原创 React-Native的环境搭建
趁着这个清明假期,可以好好的做一下总结,最近又在做RN的项目,刚开始也是一筹莫展的,最终也是完成了环境搭建,好了废话不多说了,直接进入主题吧.RN官网的连接:搭建开发环境 · React Native 中文网JAVA_SDK:Java Downloads | OraclePython_SDK:Welcome to Python.orgDownload Android Studio and SDK tools | Android Developers (google.cn)Android...
2022-04-03 09:50:44
334
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人