<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[triggerV的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/triggerV</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; triggerV]]></copyright><item><title><![CDATA[React11：数据请求与 TanStack Query]]></title><link>https://blog.youkuaiyun.com/triggerV/article/details/169260603</link><guid>https://blog.youkuaiyun.com/triggerV/article/details/169260603</guid><author>triggerV</author><pubDate>Tue, 27 Oct 2026 14:49:43 +0800</pubDate><description><![CDATA[本课核心是掌握 TanStack Query 如何管理服务端状态，解决列表页数据缓存、去重、自动刷新等问题。通过 QueryClientProvider 全局挂载缓存实例，使用 useQuery 以 queryKey 唯一标识数据，实现参数变化时自动重查、缓存秒出；结合 useMutation 与 invalidateQueries 完成写操作后自动刷新。强调区分客户端状态（useState）与服务端状态（React Query），明确其在中后台项目中的必要性，避免滥用 useEffect 请求。]]></description><category></category></item><item><title><![CDATA[React10：状态管理 Zustand]]></title><link>https://blog.youkuaiyun.com/triggerV/article/details/169259685</link><guid>https://blog.youkuaiyun.com/triggerV/article/details/169259685</guid><author>triggerV</author><pubDate>Tue, 27 Oct 2026 14:29:11 +0800</pubDate><description><![CDATA[本课讲解 React 状态管理核心工具 Zustand，类比 Vue 的 Pinia，解决 props 钻井与 Context 重渲染问题。通过 create 创建类型安全的 store，state 与 actions 同层定义，支持细粒度 selector 订阅避免冗余渲染。可于组件外调用 getState()/setState()，结合 persist 中间件实现持久化。对比 Redux Toolkit，Zustand 更轻量、易用，成为企业新项目的首选状态管理方案。]]></description><category></category></item><item><title><![CDATA[React09：React Router 路由]]></title><link>https://blog.youkuaiyun.com/triggerV/article/details/169163106</link><guid>https://blog.youkuaiyun.com/triggerV/article/details/169163106</guid><author>triggerV</author><pubDate>Mon, 26 Oct 2026 15:35:55 +0800</pubDate><description><![CDATA[本课系统讲解 React Router 路由核心用法：掌握组件式与对象式路由配置，理解布局路由与 <Outlet> 嵌套机制；熟练使用动态路由 :id 及 useParams 获取参数，配置 * 实现 404 兜底；通过 <Link>/<NavLink> 实现声明式导航，结合 useNavigate 实现编程式跳转（支持 push、replace、back）；利用 useSearchParams 管理查询参数；最后学习 React.lazy + <Suspense> 实现路由懒加载，并封装 <Require]]></description><category></category></item><item><title><![CDATA[React08：自定义 Hook]]></title><link>https://blog.youkuaiyun.com/triggerV/article/details/169160032</link><guid>https://blog.youkuaiyun.com/triggerV/article/details/169160032</guid><author>triggerV</author><pubDate>Mon, 26 Oct 2026 14:36:57 +0800</pubDate><description><![CDATA[本课讲解自定义 Hook 的核心概念与实战应用：以 use 开头、内部调用内置 Hook，实现逻辑复用。强调两条规则——顶层调用与仅在函数组件/自定义 Hook 中使用，确保状态顺序稳定。手写企业常用 Hook：useToggle（状态切换）、useLocalStorage（持久化）、useDebounce（防抖值）、useFetch（请求三态），并掌握组合使用（如 useTodos 组合 useLocalStorage），遵循“底层管机制、上层管业务”原则。返回值设计兼顾对象与数组形式，结合 TypeSc]]></description><category></category></item><item><title><![CDATA[React07：性能优化三件套]]></title><link>https://blog.youkuaiyun.com/triggerV/article/details/169147717</link><guid>https://blog.youkuaiyun.com/triggerV/article/details/169147717</guid><author>triggerV</author><pubDate>Mon, 26 Oct 2026 10:48:41 +0800</pubDate><description><![CDATA[React 性能优化核心在于理解“无自动依赖追踪”的心智模型：状态更新时，父组件全量重渲染，子组件默认也重执行。需通过 React.memo 做浅比较跳过无变化的子组件，但其效果依赖 props 引用稳定——必须配合 useCallback（锁函数）和 useMemo（锁对象/计算结果）确保引用不变。优化前先用渲染计数、日志与 Profiler 量化问题，优先做结构性优化（如状态下沉、key 设定），避免盲目加 memo。记住：90% 的组件无需优化，只有大列表、昂贵计算或高频更新场景才值得动刀。]]></description><category></category></item><item><title><![CDATA[React06：组件通信]]></title><link>https://blog.youkuaiyun.com/triggerV/article/details/168879657</link><guid>https://blog.youkuaiyun.com/triggerV/article/details/168879657</guid><author>triggerV</author><pubDate>Fri, 23 Oct 2026 17:01:11 +0800</pubDate><description><![CDATA[本课梳理了React组件通信全景图：父传子用props，子传父用回调函数props（如onToggle），跨层通信用Context，兄弟组件通过状态提升，全局状态用Zustand等。重点掌握回调props实现子传父、Context三步法（createContext/Provider/useContext）、useImperativeHandle暴露方法，并强调“能用props就不用Context，能用Context就不滥用ref”的企业级选型原则。]]></description><category></category></item><item><title><![CDATA[React05：useEffect 与副作用]]></title><link>https://blog.youkuaiyun.com/triggerV/article/details/168769325</link><guid>https://blog.youkuaiyun.com/triggerV/article/details/168769325</guid><author>triggerV</author><pubDate>Thu, 22 Oct 2026 16:48:27 +0800</pubDate><description><![CDATA[本课详解 React 的 useEffect 作为「挂载、监听、卸载」三合一的副作用处理机制，强调其与 Vue watch 的核心差异：useEffect 每次渲染后必执行一次，依赖数组需手动填写且使用浅比较。通过三形态依赖数组（不写、[]、[a,b]）掌握执行时机，理解清理函数在依赖变化和卸载时的双重触发机制。重点掌握企业级数据请求模式：三态管理（loading/error/data）与 ignore 标志防竞态，并依据官方“无需 effect”标准识别冗余代码，提升组件健壮性与可维护性。]]></description><category></category></item><item><title><![CDATA[React04：事件处理与受控表单]]></title><link>https://blog.youkuaiyun.com/triggerV/article/details/168764011</link><guid>https://blog.youkuaiyun.com/triggerV/article/details/168764011</guid><author>triggerV</author><pubDate>Thu, 22 Oct 2026 14:24:25 +0800</pubDate><description><![CDATA[本课聚焦React事件处理与受控表单，替代Vue的@click和v-model。通过onClick驼峰绑定实现无参、带参及修饰符（.prevent/.stop）功能，强调避免onClick={func()}的陷阱；使用value + onChange模式构建受控组件，掌握ChangeEvent等类型标注规范；推广统一updateField模板管理多类型表单，区分受控与非受控场景（如文件上传），并遵循handleXxx命名约定，提升代码可维护性与团队协作效率。]]></description><category></category></item><item><title><![CDATA[React03：useState 与不可变更新]]></title><link>https://blog.youkuaiyun.com/triggerV/article/details/168751210</link><guid>https://blog.youkuaiyun.com/triggerV/article/details/168751210</guid><author>triggerV</author><pubDate>Thu, 22 Oct 2026 10:51:45 +0800</pubDate><description><![CDATA[本课系统讲解 React 状态管理核心：useState 的使用规范与不可变更新原则。强调状态应通过 setXxx 函数式更新，避免直接修改；理解“快照”机制，连续更新需用函数式写法确保正确累加；掌握数组/对象必须创建新引用（如展开运算符、map/filter），否则视作无变化；了解批处理优化与 Object.is 判断导致的跳过渲染；最后明确派生数据应在渲染时直接计算，避免冗余状态维护，提升代码健壮性。]]></description><category></category></item><item><title><![CDATA[React02：组件与 Props]]></title><link>https://blog.youkuaiyun.com/triggerV/article/details/168658018</link><guid>https://blog.youkuaiyun.com/triggerV/article/details/168658018</guid><author>triggerV</author><pubDate>Wed, 21 Oct 2026 17:01:59 +0800</pubDate><description><![CDATA[本课系统讲解 React 函数组件与 Props 的核心用法：组件即“props 进、JSX 出”的纯函数，首字母大写，通过接口定义类型；解构 + 默认值实现 withDefaults 效果，对象/数组默认值直接写 [] {}；children 对应默认插槽，传 JSX 为具名插槽，传函数为作用域插槽；使用 ReactNode、可选属性、联合类型进行类型约束；...rest 透传属性，遵循单向数据流——props 只读，修改需通过回调。]]></description><category></category></item><item><title><![CDATA[React01：JSX 与渲染心智模型]]></title><link>https://blog.youkuaiyun.com/triggerV/article/details/168656747</link><guid>https://blog.youkuaiyun.com/triggerV/article/details/168656747</guid><author>triggerV</author><pubDate>Wed, 21 Oct 2026 16:12:13 +0800</pubDate><description><![CDATA[本课核心是掌握 JSX 的「模板即 JS」心智转变：不再依赖指令，直接用 JS 表达式渲染界面。通过对比 Vue 指令与 JSX 写法，掌握 v-if→&&/三目、v-for→map、class→className等无损转换。重点理解 {} 中仅支持表达式，null/false/undefined 不渲染但 0 会显示。条件渲染推荐四类写法：单分支用 &&，双分支用三目，复杂逻辑用变量承载或提前 return。列表渲染必须加 key，避免用 index 导致删除错乱。熟悉驼峰属性名（如 onClick、st]]></description><category></category></item><item><title><![CDATA[TypeScript 08：条件类型、infer 与手写工具类型]]></title><link>https://blog.youkuaiyun.com/triggerV/article/details/167912190</link><guid>https://blog.youkuaiyun.com/triggerV/article/details/167912190</guid><author>triggerV</author><pubDate>Wed, 14 Oct 2026 14:25:02 +0800</pubDate><description><![CDATA[本文详解 TypeScript 条件类型、infer 与模板字面量，揭示工具类型底层原理。通过分发机制实现联合类型逐项处理，利用 infer 提取泛型参数，结合模板字符串构建精确类型约束。手写 Exclude、Pick、Record 等常用工具类型，掌握“约束→条件→infer→mapped”拆解逻辑，彻底理解类型系统无魔法本质。]]></description><category></category></item><item><title><![CDATA[TypeScript 07：工程化——import type、声明文件与 tsconfig]]></title><link>https://blog.youkuaiyun.com/triggerV/article/details/167893202</link><guid>https://blog.youkuaiyun.com/triggerV/article/details/167893202</guid><author>triggerV</author><pubDate>Wed, 14 Oct 2026 10:17:05 +0800</pubDate><description><![CDATA[本文系统讲解 TypeScript 工程化核心：通过 import type 实现类型与值分离，避免运行时冗余；使用 .d.ts 声明文件让编译器“认识”外部模块；合理配置 tsconfig 的 strict 族选项（如 noImplicitAny、strictNullChecks）提升类型安全；结合 verbatimModuleSyntax 等选项，实现高效、健壮的类型管理。附高频报错速查，助力项目类型体系落地。]]></description><category></category></item><item><title><![CDATA[TypeScript 06：函数类型与四大特殊类型]]></title><link>https://blog.youkuaiyun.com/triggerV/article/details/167809743</link><guid>https://blog.youkuaiyun.com/triggerV/article/details/167809743</guid><author>triggerV</author><pubDate>Tue, 13 Oct 2026 16:54:27 +0800</pubDate><description><![CDATA[本文详解 TypeScript 函数类型与四大特殊类型。函数类型由参数和返回值定义，支持复用与上下文推断；void 表示调用方不应使用返回值；函数重载可精确描述多组参数与返回类型；any 放弃检查，unknown 需收窄后使用，void 无有效返回值，never 表示永不返回。掌握这些类型有助于避免常见报错，提升代码安全性。]]></description><category></category></item><item><title><![CDATA[TypeScript 05：交叉类型、索引签名、元组与 enum]]></title><link>https://blog.youkuaiyun.com/triggerV/article/details/167809314</link><guid>https://blog.youkuaiyun.com/triggerV/article/details/167809314</guid><author>triggerV</author><pubDate>Tue, 13 Oct 2026 16:36:04 +0800</pubDate><description><![CDATA[本文详解 TypeScript 中交叉类型 &、索引签名、元组与 enum 的用法。交叉类型实现类型合并，适用于扩展接口；索引签名用于动态键值对象，需注意 undefined 安全性；元组支持定长定序，标签元组提升可读性；推荐用 as const 对象替代 enum，实现类型安全且可剥离。附高频报错解析，助快速定位问题。]]></description><category></category></item><item><title><![CDATA[TypeScript 04：类型断言与类型守卫]]></title><link>https://blog.youkuaiyun.com/triggerV/article/details/167808690</link><guid>https://blog.youkuaiyun.com/triggerV/article/details/167808690</guid><author>triggerV</author><pubDate>Tue, 13 Oct 2026 16:06:59 +0800</pubDate><description><![CDATA[本文讲解 TypeScript 中类型断言与类型守卫的使用场景。通过 as、! 进行断言，快速传递额外知识，但需谨慎；is 函数将验证逻辑封装为可复用的类型守卫，实现安全收窄；never 用于穷尽检查，确保分支全覆盖；satisfies 在保留精确类型的同时验证结构，适合配置类数据。核心原则：边界可用断言，内部优先使用类型守卫，保障类型系统的可靠性。]]></description><category></category></item><item><title><![CDATA[TypeScript 03：泛型与工具类型]]></title><link>https://blog.youkuaiyun.com/triggerV/article/details/167788323</link><guid>https://blog.youkuaiyun.com/triggerV/article/details/167788323</guid><author>triggerV</author><pubDate>Tue, 13 Oct 2026 10:39:33 +0800</pubDate><description><![CDATA[本文介绍 TypeScript 泛型与工具类型：泛型通过类型参数实现复用与精确类型控制，避免 any 带来的类型丢失；通过 extends 约束确保类型具备特定能力；keyof 提取字段名联合类型；内置工具类型如 Partial、Pick、Omit、Record 等用于类型变换，本质是泛型结合字段遍历；typeof 与 ReturnType 可从函数提取返回类型，提升开发效率。]]></description><category></category></item><item><title><![CDATA[TypeScript 02：interface、type 与类型收窄]]></title><link>https://blog.youkuaiyun.com/triggerV/article/details/167784382</link><guid>https://blog.youkuaiyun.com/triggerV/article/details/167784382</guid><author>triggerV</author><pubDate>Tue, 13 Oct 2026 10:06:39 +0800</pubDate><description><![CDATA[本文系统讲解 TypeScript 中 interface 与 type 的区别与使用场景，强调对象形状用 interface，联合/字面量类型用 type。重点介绍可选属性、只读字段、字面量类型及 as const 的作用。核心在于类型收窄：处理联合类型前必须通过 typeof、in 或值比较等方式缩小范围，确保类型安全。同时推荐使用 unknown 替代 any，强制收窄后再操作，提升代码健壮性。附高频报错速查表，助快速定位问题。]]></description><category></category></item><item><title><![CDATA[TypeScript 01：类型注解与类型推断]]></title><link>https://blog.youkuaiyun.com/triggerV/article/details/167697679</link><guid>https://blog.youkuaiyun.com/triggerV/article/details/167697679</guid><author>triggerV</author><pubDate>Mon, 12 Oct 2026 15:59:07 +0800</pubDate><description><![CDATA[TypeScript 在 JavaScript 基础上引入类型系统，实现编译时类型检查，提前捕获运行时错误。通过类型注解（如 let age: number）和类型推断（如 let price = 99），可精准定义变量、数组、对象与函数类型。联合类型（string | number）支持多类型兼容，而 any 虽灵活但应慎用，推荐使用更安全的 unknown。掌握常见报错（如类型不匹配、字段缺失、参数数量不符）有助于快速定位问题，提升代码健壮性。]]></description><category></category></item><item><title><![CDATA[基于 qiankun 的应用间页面跳转]]></title><link>https://blog.youkuaiyun.com/triggerV/article/details/159242778</link><guid>https://blog.youkuaiyun.com/triggerV/article/details/159242778</guid><author>triggerV</author><pubDate>Thu, 19 Mar 2026 11:38:40 +0800</pubDate><description><![CDATA[微前端架构中的路由委托方案 本文提出了一种基于控制反转（IoC）模式的微前端路由解决方案。在Vue3+qiankun架构中，通过主应用将路由能力注入微应用，解决微前端环境下的路由碎片化问题。主应用作为IoC容器，封装路由能力并通过props注入微应用，提供两种实现方式：封装导航方法（mainNavigate）或直接暴露路由实例（mainRouter）。方案支持统一拦截处理权限校验、埋点等逻辑，同时兼容多种入口路径和全局状态共享。相比传统路由方案，该委托模式实现了主微应用间的解耦，保持了无缝跳转体验和状态一致]]></description><category></category></item></channel></rss>