源自 GitHubVue3组合式代码架构规范
该功能面向 Vue 3 现代化开发流程，以 Composition API、<script setup lang="ts"> 与 TypeScript 为核心标准。它要求在编码前先行规划组件单一边界、明确 Props/Emits 数据流动契约，并指导将复杂逻辑与副作用下沉至独立的 Composable 函数中，避免巨型单文件组件产生。同时涵盖内置组件调用标准、按需渲染与异步加载策略，并在功能实现完成后提供针对性的性能调优与自检清单。
它会先理解你的原始内容和目标，再按清晰的步骤完成处理。你不需要学习复杂命令，也不用理解背后的技术细节。
常见场景
它能帮你做什么？
01
02
03
三步完成
怎么使用
1安装 Skill
把右侧安装请求发给你的 AI。
2说清楚目标
告诉 AI 你想完成什么，或直接贴入内容。
3检查结果
按需要继续调整语气、范围或格式。
复制就能用
你可以直接这样说
“请帮我重构这个 600 行的 UserManagement.vue 组件，将状态逻辑抽离为 useUserList 组合式函数，并拆分出 SearchFilter 和 UserTable 两个子组件。”
“基于 Vue 3 <script setup lang="ts"> 编写一个支持分页、行内编辑和批量删除的商品列表组件，严格遵循单向数据流与类型契约。”
“我的订单看板在实时轮询更新时出现渲染卡顿，请结合 computed 派生状态与 v-memo 对列表渲染机制进行优化。”
适用人群
适合谁？
上手门槛
使用难度
进阶
需要了解任务流程，页面已整理好使用步骤。
兼容范围
支持哪些 AI？
Codex可直接使用
Claude Code可直接使用
OpenClaw可直接使用
Hermes可直接使用国内 Agent可直接使用
中文用户增强
Skill Px 做了什么？
中文说明简化使用方式补充中文案例整理安装流程降低理解难度
