- 博客(122)
- 收藏
- 关注
RSS订阅原创 完美解决html2canvas + jsPDF导出pdf分页内容截断问题
完美解决html2canvas + jsPDF导出pdf分页内容截断问题
2024-08-16 19:09:54
1294
原创 别再抱怨后端一次性传给你 1w 条数据了，几行代码教会你虚拟滚动！
如果后端一次性传给你 1 万条数据，该怎么办，当然是让他圆润的走开，哈哈，开个玩笑。虽然这种情况很少，不过我在实际开发中还真遇到了类似的情况，接下来我将基于 vue3 实现一个简单的虚拟滚动。我们都知道，如果一次性展示所有的数据，那么会造成页面卡顿，虚拟滚动的原理就是将数据根据滚动条的位置进行动态截取，只渲染可视区域的数据，这样浏览器的性能就会大大提升，废话不多说，我们开始。
2024-07-18 16:38:55
335
原创 别想调试我的前端页面代码
需要注意的是，这些技术可以增加攻击者分析和调试代码的难度，但无法完全阻止恶意调试。因此，对于一些敏感信息或关键逻辑，最好的方式是在后端进行处理，而不是完全依赖前端来保护。
2024-07-08 19:39:16
637
原创 Vue.js与Nuxt.js的区别
预渲染，简称SSG，指提前渲染静态的html，提高页面响应。Nuxt.js中同样可以设置SSG，你可以根据自己的需求，将不同页面分别设置为SSR页面、SPA页面、SSG页面。在Nuxt.js中，可以设置部分页面SSR，部分页面则是SPA，这样能降低服务器的资源耗费。Vue.js与Nuxt.js都是前端的两个框架，Vue.js的项目属于单页应用，而Nuxt.js是基于Vue.js的服务端渲染通用框架。因此，结果是查看源代码没有别的东西，搜索引擎爬虫也基本只能看到这些，于是便直接下一个了，不会等你渲染。
2024-06-13 10:55:24
685
原创 js如何实现当文本内容过长时，中间显示省略号...,两端正常展示
前一阵做需求时，有个小功能实现起来废了点脑细胞，觉得可以记录一下。产品的具体诉求是：用户点击按钮进入详情页面，详情页内的卡片标题内容过长时，标题的前后两端正常展示，中间用省略号...表示，并且鼠标悬浮后，展示全部内容。关于鼠标悬浮展示全部内容的代码就不放在这里了，本文主要写关于实现中间省略号...的代码。
2024-06-04 18:14:02
1228
2
原创 别忘了前端是靠什么起家的
回想起多年前，前端开发者常被戏称为“切图仔”，但就是这样的角色，通过精湛的CSS技巧，能够实现各种复杂的交互和特效，展现出前所未有的网页魔法。这种做法增加了样式的可复用性，因为相同的组合选择器样式可以在不同的HTML结构中被复用，只要这些结构符合选择器定义的元素关系。总之，伪元素选择器为CSS提供了强大的功能，使得开发者能够以更细致和动态的方式控制网页的样式和内容。组合选择器在CSS中扮演着至关重要的角色，它们提供了一种强大的机制来选择具有特定关系的元素，从而允许开发者以更精细、更具体的方式应用样式。
2024-05-06 08:00:00
940
原创 前端太卷了，不玩了，写写node.js全栈涨工资，赶紧学起来吧！！！！！
Express是一个轻量级且灵活的Node.js Web应用程序框架，它提供了一组简洁而强大的工具，帮助开发者快速构建Web应用。Express的核心理念是中间件，通过中间件可以处理HTTP请求、响应以及应用程序的逻辑。
2024-04-29 08:00:00
789
原创 Vue3 新项目，没必要再用 Pinia 了！
最近弄了一个新的 Vue3 项目，页面不多，其中有三四个页面需要共享状态，我几乎条件反射般地安装了 Pinia来做状态管理。后来一想，我只需要一个仓库，存放几个状态而已，有必要单独接一套 Pinia 吗？其实不需要，我差点忘记了 Vue3 的一个重要特性，那就是 组合式函数。组合式 API 大家都知道，组合式函数可能大家没有特别留意。但是它功能强大，足矣实现全局状态管理。
2024-04-23 19:17:13
324
原创 京东一面：post为什么会发送两次请求？
预检请求是在进行跨域资源共享CORS时，由浏览器自动发起的一种 OPTIONS 请求。它的存在是为了保障安全，并允许服务器决定是否允许跨域请求。跨域请求是指在浏览器中向不同域名、不同端口或不同协议的资源发送请求。出于安全原因，浏览器默认禁止跨域请求，只允许同源策略。而当网页需要进行跨域请求时，浏览器会自动发送一个预检请求，以确定是否服务器允许实际的跨域请求。
2024-04-01 19:32:37
1025
原创 同学，请实现一个扫码登录
在跟后台联调的过程中发现定时器每1s请求一次接口，发现很多接口没等响应就开启下一次的请求，很多请求都还在pending中，这样是不对的，对性能是很大消耗。3、解决了上面提到的问题，就在以为万事大吉，只待提测的时候。所谓的轮询就是，由后端维护某个状态，或是一种连续多篇的数据（如分页、分段），由前端决定按序访问的方式将所有片段依次查询，直到后端给出终止状态的响应（结束状态、分页的最后一页等）。试了下确实达到效果了，但其实这个问题产生的具体原因我还是有些模糊的，希望遇到过相关问题的大佬能指点一下，感激不尽！
2024-03-12 16:11:29
811
原创 面试官：js需要同时发起百条接口请求怎么办？--通过Promise实现分批处理接口请求
不知你项目中有没有遇到过这样的情况，反正我的实际工作项目中真的遇到了这种玩意，一个接口获取一份列表，列表中的每一项都有一个属性需要通过另一个请求来逐一赋值，然后就有了这份封装真的是很多功能都是被逼出来的。
2024-03-12 15:49:12
621
原创 通过Vue自定义指令实现前端埋点
这种方法在项目中埋点比较少时还行，一旦项目中需要大量埋点时，不可避免的要添加很多业务代码。为了保证点击率的准确性，我们必须保证用户真正的浏览到了这些产品（就比如上图中最下方的机酒产品区域，由于需要滚动页面，用户才有可能看到这一区域）。手动埋点，顾名思义就是纯手动写代码，调用埋点 SDK 提供的函数，在需要埋点的业务逻辑中添加对应方法，上报埋点数据。有了点击和曝光类，下一步就是 Vue 指令的封装了，也是之所以能实现半自动埋点的核心。页面埋点在框架层面已经帮我们做掉了，这里主要关心的是点击埋点和曝光埋点。
2023-12-28 17:01:44
1430
原创 async/await的实现原理（手动实现）
如果当前执行的是A协程，要启动B协程就需要暂停A协程，把js主线程的控制权交给B协程，这样表现为A协程暂停，B协程开始执行，此时我们把A协程称为B协程的父协程。对于js的异步编程场景，无论是使用xhr回调还是promise回调，当异步操作过多并且每个动作之间存在依赖关系（即需要串行执行）时，代码的可读性和维护性会变得很差。在执行过程中，如果遇到yield关键字，函数会返回关键字后面的内容给外部，然后暂停执行。带*号的函数就叫生成器函数，是可以暂定执行和恢复执行的。v8是如何实现函数的执行和恢复的呢？
2023-12-01 15:18:09
419
原创 vue开发，如何结合chatgpt
当然,ChatGPT生成的代码还不能完全替代人工编码,需要开发者review和修复,但它无疑已经成为开发者的好帮手。未来,随着技术的进步,ChatGPT将产生越来越“智能”的代码,真正实现“代码即自然语言”的愿景,彻底改变前端开发方式。通过上面的交互,我们仅使用自然语言就完成了一个评论功能的开发,ChatGPT自动生成了Vue代码,包括模板、方法、AJAX请求等。随着人工智能技术的发展,尤其是自然语言处理的进步,代码生成不再是梦想。只有不断进步,才能适应未来技术变革带来的挑战,在人工智能时代继续发光发热。
2023-05-21 21:35:40
2574
原创 从0搭建Vue3组件库(十二):引入现代前端测试框架 Vitest
Vitest 是个高性能的前端单元测试框架,它的用法其实和 Jest 差不多,但是它的性能要优于 Jest 不少,还提供了很好的 ESM 支持,同时对于使用 vite 作为构建工具的项目来说有一个好处就是可以公用同一个配置文件。因此本项目将会使用 Vitest 作为测试框架。
2023-05-10 11:35:21
1174
原创 从0搭建Vue3组件库(十一): 集成项目的编程规范工具链(ESlint+Prettier+Stylelint)
从0搭建Vue3组件库(十一): 集成项目的编程规范工具链(ESlint+Prettier+Stylelint)
2023-04-30 07:30:00
1722
原创 从0搭建Vue3组件库(八):使用 release-it 实现自动管理发布组件库
从0搭建Vue3组件库(八):使用 release-it 实现自动管理发布组件库
2023-04-25 16:00:00
935
2
原创 从0搭建Vue3组件库(七):使用 gulp 打包组件库并实现按需加载
当我们使用 Vite 库模式打包的时候,vite 会将样式文件全部打包到同一个文件中,这样的话我们每次都要全量引入所有样式文件做不到按需引入的效果。删除打包目录函数可以放在 bulid/utils 中的 delpath.ts,注意这里因为打包后的 easyest 包是我们最终要发布的包,所以我们需要将package.json和README.md保留下来。然后写一个打包样式的函数,这里使用到了 gulp 的dest和src函数,不知道什么意思的乐意看上一篇文章 gulp 的介绍。然后引入 run 函数。
2023-04-24 21:17:25
1084
3
原创 vue-router中history模式与hash模式的使用及比对
hash和history如果使用hash模式，一般无需特殊配置；但如果要使用history模式，则前端和服务端要做一定的设置；使用history模式通常本地调试没有什么问题，但是一旦发布到测试或生产环境，则会出现页面白屏或者刷新页面白屏的现象，这种问题的出现是因为前端和服务端没有做相应的配置。
2023-04-05 15:25:25
1266
原创 Vue的渲染函数render&h
vue中我们一般会用模板来创建HTML，但是在有些情况也会需要用到渲染函数。渲染函数是用来生成Virtual DOM的。Vue推荐使用模板来构建我们的应用界面，在底层实现中Vue会将模板编译成渲染函数。
2023-03-16 10:02:51
1225
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人