必须先追问再写代码，因为ChatGPT无法自动感知项目技术栈、交互状态和设计约束；需用三问触发式提问法明确①技术栈、②交互状态、③设计规范，再精准交付可落地的React按钮组件。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
你想让chatgpt帮你写一个react按钮组件，但直接丢一句“写个按钮”就跑，结果生成的代码缺状态、没样式、不支持禁用态，还硬编码了文字——根本没法塞进你的项目里。真正能落地的组件，必须从追问开始。为什么必须先追问再写代码
ChatGPT不是读心术，它看不到你项目里的package.json版本、组件库依赖（比如是否用了MUI或Ant Design）、设计规范（Figma链接或色值表），更不知道这个按钮是用在表单提交还是菜单切换。不问清楚就写，等于闭眼画图——画得越快，返工越多。
它默认按“最通用场景”生成：无状态、纯HTML、内联样式、无TypeScript类型。而你的真实需求可能是“带loading状态的异步提交按钮，兼容Tailwind + React 18 + TypeScript 5.4，点击后禁用3秒”。这四点，它一个字都不会猜。
三问触发式提问法
把下面这段话完整复制粘贴给ChatGPT，一字不改：
请作为资深前端工程师与我协作。在写任何代码前，必须先向我提出3个精准问题：①这个组件将集成在什么技术栈中？（例如：React 18 + Vite + TypeScript + Tailwind CSS）②它需要响应哪些交互状态？（例如：默认/悬停/禁用/加载中/成功反馈）③是否有设计约束？（例如：使用#3b82f6主色、圆角为0.5rem、图标必须来自Heroicons v2）【只有在你确认全部问题的回答后，才开始写代码】。
立即学习“前端免费学习笔记（深入）”；
【注意：不要写“你可以问我”，必须用“必须先问”；不要加“谢谢”“请”等软化词，指令越硬越有效】
追问内容怎么答才不翻车
第一步：说清技术底座 → 直接甩出package.json里关键字段，别只说“用React”。例如："react": "^18.2.0", "typescript": "^5.4.5", "tailwindcss": "^3.4.3"。
前端设计与 UI/UX 全方位优化专家。覆盖视觉层次、排版系统、色彩理论、响应式布局、交互体验、动画动效、无障碍访问、性能优化八大维度，帮助开发者将普通页面升级为高品质产品级界面。前端设计与 UI/UX 全方位优化专家。覆盖视觉层次、排版系统、色彩理论、响应式布局、交互体验、动画动效、无障碍访问、性能优化八大维度，帮助开发者将普通页面升级为高品质产品级界面。
第二步：列全状态流 → 不要只说“要有禁用态”。要写明触发条件，比如：“点击后立即禁用，同时显示旋转图标；API返回成功后自动恢复，并闪动绿色边框1次”。
第三步：交出设计资产 → 给Hex色值、字体大小px/em/rem、图标SVG路径或Icon组件导入语句。如果用Figma，直接贴“主按钮/Fill-Primary”图层名，比描述“蓝色圆角按钮”管用十倍。
【切忌回答“大概用蓝色”“应该有hover效果”——模糊描述=AI自由发挥=你加班重写】
两种常见失效追问及解法
方法一：问题太宽泛 → 错误示范：“你还需要什么信息？” → ChatGPT会回你一堆开放式问题，最后你挑三个随便填，它还是写错。正确做法：锁死3个维度（技术栈/状态/设计），每个问题只允许填空式回答。
方法二：用户自己答跑偏 → 比如你回答“用React”，却不提版本；说“要禁用态”，却漏掉“禁用时需保留tooltip”。这时ChatGPT可能默认用React 16语法或忽略无障碍属性。解决办法：它每问一个，你答完立刻反问“这个信息够精确吗？是否还需补充约束？”逼它当场确认。
