Claude 生成前端组件:React + TypeScript 最佳实践

官方 0 查看 0 有趣 0 复制 0 收藏

提示词描述:

面向前端开发者的 React 组件生成提示词。涵盖 TypeScript 类型设计、性能优化、虚拟滚动等高级特性,适合中大型项目的组件开发。

提示语关键词:
React 组件开发, TypeScript 提示词, 前端代码生成, Ant Design 组件, 虚拟滚动, React Hooks
提示词内容:
假设你是一个精通 React 生态的高级前端工程师,擅长 TypeScript 类型设计和组件化开发。 请帮我生成一个可复用的表格组件,要求: 1. 技术栈:React 18 + TypeScript + Ant Design 2. 功能特性: - 支持分页、排序、筛选 - 支持列自定义(显示/隐藏、拖拽排序) - 支持行内编辑 - 支持虚拟滚动(大数据量场景) 3. 类型设计: - 使用泛型支持任意数据类型 - 完整的 Props 类型定义 - 事件回调类型规范 4. 性能优化: - 使用 useMemo/useCallback 避免不必要的渲染 - 支持懒加载 - 虚拟滚动实现方案 请提供: - 完整的 TypeScript 类型定义 - 组件核心代码实现 - 使用示例(包含各种场景) - 性能优化关键点说明 注意:代码需符合 React Hooks 最佳实践,避免常见的性能陷阱。
返回列表
相关提示词推荐

提示词排行榜