LogoClawIndex
案例技能关于
LogoClawIndex

refactor_nextjs_nav_mobile_toggle_labels - 带移动切换和标签的Next.js导航重构

重构Next.js导航组件，添加移动切换功能和文本标签以提升移动设备可用性

标签

更新于: 2026-03-09
导航移动端响应式nextjs切换标签重构

能力

导入React hooks初始化状态变量创建切换处理程序渲染切换按钮

典型输入

Next.js导航组件现有navData数组图标导入

典型输出

重构后的导航组件移动切换功能响应式文本标签

该技能可以做什么

  • 导入React hooks
  • 初始化状态变量
  • 创建切换处理程序
  • 渲染切换按钮
  • 构建导航项目
  • 应用条件渲染
  • 处理链接点击
  • 定义响应式样式

输入

  • Next.js导航组件
  • 现有navData数组
  • 图标导入
  • React hooks
  • Tailwind CSS类

输出

  • 重构后的导航组件
  • 移动切换功能
  • 响应式文本标签
  • 移动友好菜单

要求

  • React
  • Next.js框架
  • Tailwind CSS
  • 函数组件
  • 移动断点支持

来源

  • 规范: SKILL.md

ClawIndex

OpenClaw Skills 与 Use Case 索引

ClawIndex 是一个生态驱动的 OpenClaw Skills 与真实 Use Case 索引站。

索引

Skills·
Cases

Meta

关于·
声明·
邮箱·
GitHub
© 2026 ClawIndex 保留所有权利。