-
映射类型通过显式声明API契约（Req/Res）为双向绑定提供强类型基础，结合Zod校验、类型守卫与自动化工具链实现编译期检查和运行时防护。
-
必须显式声明transition:background-color0.3sease，避免用all；初始和目标色值需同类型（如均用十六进制），且元素必须有明确background-color声明；移动端需设-webkit-tap-highlight-color:transparent。
-
filter:invert()不能真正“自动反转颜色”，因为它无差别逐像素取反，导致彩色文本消失、图标模糊、对比度崩坏，且不区分语义与背景/前景。
-
在ReactNative使用ReactNavigation时，需在组件“即将显示但尚未渲染完成”阶段触发数据获取等操作，推荐使用navigation.addListener('focus')配合useEffect实现精准、可靠的生命周期响应。
-
Flex布局内容“偏移”多因外层margin/padding干扰或justify-content/align-items未统一设置，需用开发者工具检查并重置父容器边距，同时确保主轴与交叉轴对齐方式匹配。
-
auto-fill会创建尽可能多的轨道并保留空白，auto-fit则只创建有内容的轨道并拉伸填满空间。例如容器宽500px、最小列宽100px时，auto-fill始终生成5个轨道（空位保留），而auto-fit仅生成实际需要的列数并扩展占满剩余空间，实现紧凑布局。区别在于是否保留空白轨道。
-
HMR通过替换修改的模块实现局部更新，保留应用状态。其依赖Webpack的module.hot.accept机制，在React中使用ReactRefresh、Vue中通过vue-loader集成，相比LiveReload避免了页面刷新，提升了开发效率。
-
columns属性在媒体查询中常无效，因依赖容器宽度和流式布局，父容器width:auto或flex/grid影响断点计算，且columns不触发重排；应设width/max-width、用column-count代替columns简写、显式声明column-gap，并避免与Grid/Flex混用。
-
Vue数据变化通过响应式系统通知依赖，组件更新函数入异步队列，nextTick批量执行render生成新VNode，仅被读取的响应式数据变化才触发重渲染。
-
background-image默认重复铺满容器，需同时设置background-repeat:no-repeat、background-size:auto或contain、background-position:center才能实现单张原图居中显示。
-
使用min-width和max-width可设置容器宽度范围，.sidebar{min-width:200px;}防止过小，.content{max-width:800px;margin:0auto;}限制过宽，结合width:100%实现响应式弹性布局，适配多设备显示效果。
-
Inject传递的必须是响应式数据源而非原始异步结果，需用ref/BehaviorSubject封装data、loading、error状态，统一管理请求生命周期、避免重复调用，并在组件销毁时清理订阅。
-
JavaScript的class只是语法糖，面向对象取决于是否用封装、继承、多态组织代码；实例属性须在constructor中初始化，方法挂载原型，私有字段用#，多态依赖鸭子类型而非类型系统。
-
响应式导航栏小屏不折叠的主因是媒体查询断点错误或flex-direction未生效；需确保max-width断点匹配设备、菜单容器设flex-direction:column且display:flex，checkbox联动逻辑正确，z-index配合position闭环。
-
纯HTML无法实现可操作账单页，因其无数据存储、计算或交互能力；必须配合JavaScript实现增删、计总与本地保存，必要时还需localStorage或后端支持。
