Vue 3 中 ref 和 reactive 在模板自动解包上的差异与踩坑记录-低调大师

Vue 3 中 ref 和 reactive 在模板自动解包上的差异与踩坑记录

2026-09-28 35

Vue 3 中如何正确监听元素尺寸变化：ResizeObserver 与自定义指令的实战

做后台管理系统的图表模块时，经常遇到一个情况：容器宽度明明是 100%，图表初始化后却挤在角落，或者拖拽侧边栏后图表没有重新计算尺寸，留出大片空白。这类问题大多不是 ECharts 或 Chart.js 本身的问题，而是 JS 没有感知到元素尺寸变化。传统的 window.resize 只能监听视口变化，但元素尺寸变动还可能来自 Flex 布局调整、父级 display 切换、字体加载导致的回流，甚至浏览器 DevTools 打开时的布局变化。ResizeObserver 就是为此而生，它能观察任意元素的 content-box 或 border-box 尺寸，在尺寸变化时触发回调。这篇文章会...

2026-09-28

51

表格组件在后台系统里几乎是刚需，但当数据量上千行、每行内容高度又不固定时，浏览器会直接卡成幻灯片。很多人第一反应是找现成的虚拟滚动库，可用在 el-table 或 antd Table 上时，往往发现它们只支持固定行高，稍微有点换行、图片或自定义插槽，滚动条就开始乱跳。这背后的核心矛盾是：虚拟滚动依赖精确的偏移量计算，而动态行高让每个元素的高度在渲染前无法预知。我在实际项目里处理过带折叠面板、多行文本和操作按钮的十万级数据表格，最终选择用 IntersectionObserver 配合占位元素来动态测量真实高度，再结合二分查找定位可视区域。这篇文章会从实际代码出发，讲清楚怎么在 Vue 3 和...

2026-09-28

33

资源下载

更多资源

优质分享App

近一个月的开发和优化，本站点的第一个app全新上线。该app采用极致压缩，本体才4.36MB。系统里面做了大量数据访问、缓存优化。方便用户在手机上查看文章。后续会推出HarmonyOS的适配版本。

腾讯云软件源

为解决软件依赖安装时官方源访问速度慢的问题，腾讯云为一些软件搭建了缓存服务。您可以通过使用腾讯云软件源站来提升依赖包的安装速度。为了方便用户自由搭建服务架构，目前腾讯云软件源站支持公网访问和内网访问。

Spring

Spring框架（Spring Framework）是由Rod Johnson于2002年提出的开源Java企业级应用框架，旨在通过使用JavaBean替代传统EJB实现方式降低企业级编程开发的复杂性。该框架基于简单性、可测试性和松耦合性设计理念，提供核心容器、应用上下文、数据访问集成等模块，支持整合Hibernate、Struts等第三方框架，其适用范围不仅限于服务器端开发，绝大多数Java应用均可从中受益。

Rocky Linux

Rocky Linux（中文名：洛基）是由Gregory Kurtzer于2020年12月发起的企业级Linux发行版，作为CentOS稳定版停止维护后与RHEL（Red Hat Enterprise Linux）完全兼容的开源替代方案，由社区拥有并管理，支持x86_64、aarch64等架构。其通过重新编译RHEL源代码提供长期稳定性，采用模块化包装和SELinux安全架构，默认包含GNOME桌面环境及XFS文件系统，支持十年生命周期更新。