首页智能体商店技能商店团队商店博客
开始使用

产品

智能体商店技能商店

社区

XDiscord
↗MossAI Tools↗Dang.ai↗Viesearch↗AIDirs↗Findly.tools↗AI Agents Directory↗Twelve Tools↗Wired Business↗ToolPilot.ai↗AIDirectori.es↗Indie.Deals↗DomainRank↗Aura++
YOLOX - Featured on Startup FameListed on Turbo0Featured on toolfame.comFeatured on saasfame.comFeatured on FoundrList
服务条款|隐私政策

© 2026 YOLOX SYSTEM. 保留所有权利。

首页智能体商店技能商店团队商店博客
开始使用
首页/技能商店/vue-best-practices
技能头像

vue-best-practices

开发者工具

让您的智能体能够遵循严格的架构和性能标准实现高质量的 Vue 3 应用程序。

使用场景

  • 当为新的 Vue 特性规划组件边界和数据流时

  • 当将大型“巨型组件”重构为更小、更专注的子组件和组合式函数 (composables) 时

  • 当通过虚拟化列表或减少重新渲染来优化 Vue 应用程序性能时

使用方式

  1. 1

    确认项目架构 (Vue 3 + Composition API + TypeScript)

  2. 2

    创建一个定义职责和 prop/emit 契约的组件图

  3. 3

    应用响应式规则,使用 computed 而不是多个 ref 来派生状态

  4. 4

    审查并针对重新渲染和模板安全性优化实现

示例对话

案例
你

你

我有一个处理整个用户仪表板的单文件。您能帮我重构它吗?

vue-best-practices

Agent

我将把您的仪表板拆分为一个特性容器、一个侧边栏和一个主内容区域。我将把共享状态移动到一个 `useDashboard` 组合式函数中,并使用“属性下行,事件上行 (props down, events up)”来管理新组件之间的通信。

FAQ

相关 Skill

查看更多
next-best-practices
next-best-practices开发者工具

让你的智能体能够遵循 App Router、RSC 和数据模式的最新规范来编写和审查 Next.js 代码。

nestjs-best-practices
nestjs-best-practices开发者工具

让你的智能体能够使用行业标准的架构和安全模式,实现生产就绪的 NestJS 应用程序。

dotnet-best-practices
dotnet-best-practices开发者工具

赋予您的智能体确保您的 .NET 和 C# 代码符合现代架构标准、设计模式和性能优化的能力。

remotion-best-practices
remotion-best-practices开发者工具

赋予您的智能体应用使用 React 和 Remotion 创建视频的专家领域知识和模式的能力,涵盖从动画到音频的所有内容。

security-best-practices
security-best-practices开发者工具

赋予您的智能体为 Web 应用程序实施专家级安全措施的能力,包括 HTTPS 强制执行、输入验证以及针对常见攻击的防护。

产品

智能体商店技能商店

社区

XDiscord
↗MossAI Tools↗Dang.ai↗Viesearch↗AIDirs↗Findly.tools↗AI Agents Directory↗Twelve Tools↗Wired Business↗ToolPilot.ai↗AIDirectori.es↗Indie.Deals↗DomainRank↗Aura++
YOLOX - Featured on Startup FameListed on Turbo0Featured on toolfame.comFeatured on saasfame.comFeatured on FoundrList
服务条款|隐私政策

© 2026 YOLOX SYSTEM. 保留所有权利。