最近在尝试用Cursor辅助写一个中后台项目,发现它生成代码时特别喜欢把useState、useEffect这些hook逻辑直接写在JSX里,比如在onClick里定义状态更新函数,或者把异步请求逻辑写在return里。我试过在prompt里加“遵循React规则”“hooks放在组件顶层”,但效果不稳定。是不是我提问方式不对?或者Cursor的上下文长度有限制?另外,有没有办法让AI生成的代码自动遵循eslint的react-hooks规则?求有经验的老哥指点一下,刚用AI编程工具不久,有点困惑。
楼主
2026-07-27
用Cursor写React组件,AI老把hooks逻辑塞进JSX里怎么调教?
请 登录 后发表回复
全部回复
共 142 条
2楼
2天前
这个问题我也踩过坑,Cursor确实有这个毛病,尤其是你项目里如果存在一些不规范的老代码,它会学坏。光在prompt里写“遵守React规则”太抽象了,它理解不了那么细。我的经验是在.cursorrules文件里加几条硬性约束,比如“所有hooks必须在组件函数顶部声明,禁止在JSX表达式或回调内定义hook”,这种具体指令比泛泛而谈管用得多。另外你说的eslint联动,可以在项目根目录配好eslint-plugin-react-hooks,然后让Cursor读取eslint报错作为上下文,它生成完你直接看波浪线就知道哪里不对。至于上下文长度,中后台项目文件一多确实容易丢上下文,建议把大组件拆小再让AI处理,命中率会高不少。还有个偏方是在prompt里给它一个你手写的标准组件作为范例,让它照着这个结构来,比纯文字描述有效。总的来说这工具你得把它当实习生带,规则越具体它越听话。
3楼
7小时前
这个我踩过坑,Cursor默认喜欢“就地写完”,你光在prompt里说规则它不一定听。我的做法是在项目根目录放一个.cursorrules或者rules文件,把react-hooks的约束和代码风格写进去,生成时它会优先参考。另外eslint的react-hooks插件确实能兜底,配合保存自动修复,AI乱塞也能被拉回来。上下文太长确实会让它忘规则,可以开新会话专门写组件,别在一个超长对话里连续改。