2025年 09月 09日窗棂上的暮光与星子 —— 重读《小王子》记《小王子》里面有一句话写的真好,狐狸告诉王子,“看东西只有用心才能看的清楚。重要的东西用眼睛是看不见的。”说实话,我们这一生,都在为那些看不见懂东西而活着 —窗棂浸着橘色暮光,风从半开的窗缝钻进来,掀动书桌前摊开的书页。那本《小王子》的封面已经泛白,书脊处粘过的胶带又有些开裂了。 高中时读《小王子》,只记得 B61…观后感
2025年 03月 29日Vue 2 + Docker + config.js + envsubst 实现运行时动态获取容器环境变量通过 Vue 2 + Docker + config.js 和 envsubst 实现运行时动态获取容器环境变量,无需重新构建镜像。 —背景 在 Vue 2 项目中,通常使用 "process.env" 来管理环境变量。但在 Docker…envsubst
2025年 02月 09日AI来了,你怕不怕?AI如潮水般涌来,有人惊喜,有人恐慌。它能写代码,能优化性能,能生成界面,却终究只是工具,而非创造者。前端开发者们若只是搬砖,终将被淘汰;若能驾驭AI,便能乘风破浪。历史的车轮滚滚向前,惟有思考者,不被碾碎。 —DeepSeek AI 大模型问世的那个凌晨,前端圈的聊天框像被投入了惊雷。有人对着屏幕里秒生成的 Vue 组件狂喜:“以后写页面再也不用调样式到凌晨了!”;有人把 AI 排查出的 BUG…AI
2025年 01月 09日解决前端crypto-js库解密失败的错误最近我在处理一个项目时遇到了一个比较棘手的问题:我成功接收到了后端加密的数据,使用crypto-js库进行解密时却总是报错“Error: Malformed UTF-8 data”,无法正确对密文codestr解密。 —…crypto-js
2024年 11月 22日一行CSS代码提升Web开发效率和用户体验随着CSS的发展,许多新的属性和功能被引入,这些新特性不仅简化了代码,还提升了用户体验。本文将介绍一些CSS的一行升级方案,帮助你在日常开发中更高效地解决问题 —1. 使用 object-fit 优化图像缩放 object-fit 属性使得 img元素 或其他替换元素的行为类似于其内容的容器,并使其内容采用类似于 background-size 的调整大小行为。最常用的值是 cover 和 scale-down: cover…css
2024年 10月 14日微信小程序使用 web-view 功能,实现内嵌 H5 项目微信小程序 web-view 内嵌 H5 端遇到的问题,并介绍了解决方案 —最近,公司根据客户需求,需要将一款使用 UniApp 开发的 OA 项目(以下简称 OA 项目)扩展至微信小程序端。目前,该 OA 项目仅支持 App 和 H5 端,并未兼容微信小程序,因此在编译到微信小程序时出现了许多样式错乱的问题。 鉴于 OA…webView
2024年 07月 30日Vue3项目中实现“电梯”效果,快速实现锚点导航功能Vue3项目中实现“电梯”效果的锚点导航功能。该功能包括点击左侧导航后右侧内容区平滑滚动到对应位置,以及右侧内容区滚动到相应位置时左侧导航动态更新选中状态。实现方法结合了scrollIntoView和IntersectionObserver —如果您的项目中没有使用Hash路由,可以使用纯css实现,具体操作请参照 scroll-behavior 如果您的项目跟我目前一样,使用的是vue的Hash…前端
2024年 05月 22日重归基础:提升可访问性与用户体验的5大HTML属性在高速发展的Web开发领域,常常令人目不暇接的是层出不穷的新框架、库以及前沿技术。然而,有时最为显著的提升源自于对基础知识的重新探索。本篇博客文章旨在引领您深入了解五个HTML属性,它们不仅对提升网站的可访问性至关重要,同时也能极大增强用户的整体体验。无论您是编程老手还是初涉此领域的新人,让我们一起探索这些元素的潜力,以创建更具包容性的Web体验。 —1. hreflang hreflang属性旨在为 <a> 或 <link> 元素中的链接资源指定语言种类,其功能与lang属性相似,但特别适用于标注链接目标的语言属性。 为什么使用 hreflang? 改善用户体验及搜索引擎优化(SEO…html
2024年 04月 15日Next.js中的基本状态管理这篇Blog提供了关于在 Next.js 中进行基本状态管理的综合指南。它涵盖了使用 useState 和 useReducer 进行本地状态管理,以及使用 Context API 进行全局状态管理的方法。此外,它还介绍了如何从外部 API 获取数据,并使用 SWR 简化数据获取和状态管理的过程。最后还探讨了 Next.js 中的中间件集成以及服务器组件中的状态管理技术。 —Next.js 中的基本状态管理 让我们从 Next.js 状态管理的基础开始。在接下来的章节中,我们将讨论基本的 Hooks、技术和工具,以便有效地管理状态。 使用 useState Hook 进行状态管理 useState Hook 是在传统的 React…Nextjs