- 博客(11)
- 收藏
- 关注
原创 Vue 3 中基于 Axios 的请求封装实践
在 Vue 3 项目中,封装请求模块是提高代码复用性和可维护性的重要步骤。通过封装 Axios,我们可以统一处理请求头、Token、错误处理和数据加密等逻辑,从而避免重复代码并提升开发效率。通过封装 Axios,我们实现了一个高效、灵活且易于维护的请求模块。:如果需要支持 Token 刷新,可以在响应拦截器中捕获 401 状态码并自动刷新 Token。:在响应拦截器中统一处理错误,避免在组件中重复编写错误处理逻辑。:如果遇到跨域问题,可以在后端配置 CORS 或通过代理解决。:通过 Axios 实例设置。
2025-03-06 10:45:00
431
原创 前端无痛当产品UI:MasterGo AI 助力高效设计与开发
MasterGo AI 作为一款融合了AI技术的设计工具,为前端开发者和产品经理提供了一个无需深厚设计背景即可快速生成设计图和原型图的解决方案。:通过简单的文字描述,MasterGo AI 可以在几分钟内生成高保真的设计稿。如果您现在没有想法,不知道如何跟MasterGo AI描述你的需求,那么你可以使用AI对话AI:使用任意一个AI工具,让他帮您生成你的需求大纲:我这里使用的是。MasterGo AI 是一款基于AI的在线设计工具,能够根据简单的文字描述快速生成高质量的UI设计图和交互原型。
2025-03-05 10:15:00
895
4
原创 Vue 2 请求封装的最佳实践:基于 Axios 的高效解决方案
请求拦截器的主要作用是在发送请求之前对请求数据进行处理,例如添加 Token、加密数据、设置请求头等。,我们可以实现统一的请求管理、错误处理和数据安全机制,从而提高开发效率和代码质量。:自动从 Vuex 中获取 Token 并添加到请求头中,支持 Token 刷新。响应拦截器用于处理服务器返回的数据,例如解密数据、验证哈希值、统一处理错误等。:如果响应头中包含新的 Token,更新 Vuex 中的 Token。如果你有任何问题或建议,欢迎留言交流。的请求封装方案,帮助你构建更高效、更安全的前端项目。
2025-03-04 10:47:05
933
原创 uni-app 请求封装:打造高效、优雅的网络请求
减少重复代码:将通用的请求逻辑集中处理,避免重复代码。便于维护:集中管理请求配置,修改一处即可生效。统一错误处理:集中处理错误逻辑,提升用户体验。封装后的请求方法不仅提高了开发效率,还增强了代码的可读性和可维护性。希望本文能帮助你在 uni-app 开发中更好地实现网络请求封装。
2025-03-03 11:21:08
1018
原创 使用 HBuilderX 打包 UniApp 为 App 应用:从零开始的完整教程
通过上述步骤,你可以轻松地使用 HBuilderX 将 UniApp 打包为App,整个过程包括安装开发工具、配置项目、生成本地打包资源,希望本文能帮助你顺利完成打包过程 ~
2025-02-25 15:06:54
871
原创 前端大屏项目适配:使用 SCSS 实现响应式布局
首先,我们需要定义设计稿的宽度和高度。假设设计稿的尺寸为 1920×1080:(之前UI同事的设计稿)// 默认设计稿的宽度和高度为了将设计稿中的px单位转换为vw和vhvw($px)和vh($px)。// px 转为 vw 的函数// px 转为 vh 的函数通过 SCSS 的math函数和自定义的vw和vh转换函数,我们可以轻松实现大屏的响应式适配。这种方法不仅灵活、可维护性强,还能确保页面在不同设备上都能完美显示。希望本文的介绍和代码示例能帮助你在前端大屏开发中更好地实现适配效果。
2025-02-21 09:12:10
1339
原创 uniapp购物车中的浮点数问题及解决方案
浮点数问题在uniapp开发中是一个常见的问题,尤其是在涉及金额计算的购物车功能中。通过引入decimal.js库并封装计算工具类,我们可以轻松解决浮点数计算精度问题,从而提升用户体验。希望这篇文章能对大家有所帮助,如果你还有其他问题,欢迎在评论区留言交流。
2025-02-20 09:30:00
827
原创 解决浏览器<audio>标签自动播放限制,如何优雅地触发音频播放
浏览器对自动播放的限制虽然给开发者带来了一些挑战,但也为用户提供了更好的体验。通过监听全局点击事件,我们可以在用户首次交互时触发音频播放,同时避免了对用户体验的干扰。希望本文的解决方案能帮助你在开发中更好地处理音频播放问题。如果有其他疑问或建议,欢迎随时交流!
2025-02-19 13:15:00
1231
原创 Vue3项目页面跳转回Uniapp页面,UniApp项目中集成Vue3
1.index.html 引入线上文件文件,地址:https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.0.1.52.js。背景:在uniapp中嵌套一个已经完善的Vue3项目,Vue3项目中有一个回到uniapp页面的功能。1.使用uni.navigateTo跳转web-view.vue组件。从Vue3项目返回Uniapp页面。也可以放在下面内去引入。
2025-02-18 11:15:00
488
原创 uniapp踩坑之——使用<video>标签层级太高问题
背景:使用uniapp开发一款无人机车载指挥终端,采用视频作为登录页的背景,将背景渲染完后继续开发剩下页面样式,运行后发现登录输入框和按钮都显示不出来。后查询uniapp官方文档,发现问题出在video标签层级过高!(有点坑...) 文档详见。由于我的登录页面样式比较简单,于是我决定使用cover-view标签解决这个问题。组件或plus.nativeObj.view、subNVue。组件在非H5端是原生组件,层级高于普通前端组件。官方给出的解决办法有3种:覆盖其需要使用。
2025-02-17 16:06:13
332
原创 uniapp App端 背景图片在真机上不能查看
背景:在工作中使用uniapp开发一款下单APP,里面涉及到商品列表,起初我使用的是view标签的backgroundImage属性去实现商品图片的动态渲染,图片路径由后端接口返回,但图片后期是由客户自己在后台维护上传,此时遇到一个问题是接口返回了一种路径是中文编码后的字符串,这种路径在真机和浏览器上显示不出来,但控制台打印出来具体路径后复制到浏览器又是能查看出图片的,所以推断并不是图片本身的问题,查看后面的图片发现一个UUID类的图片路径,这个路径对应的图片是显示出来了的。
2025-02-17 15:10:25
157
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人