是否存在ESLint规则:无逻辑时强制React箭头组件直接返回JSX?
满足需求的ESLint规则推荐
有的,你要的效果可以通过ESLint核心规则arrow-body-style实现,配合合适配置就能达成目标:
核心规则
arrow-body-style设置为"as-needed"模式后,会强制箭头函数在仅需单条return语句时使用隐式返回(即你示例里的Good写法);当函数体内有多个语句(比如使用React Hooks、条件判断等逻辑)时,允许使用带大括号的显式return(Bad写法的场景不会触发报错)。具体配置示例(在ESLint配置文件中添加):
{ "rules": { "arrow-body-style": ["error", "as-needed", { "requireReturnForObjectLiteral": false }] } }
说明:requireReturnForObjectLiteral设为false是为了适配React组件返回JSX的场景,允许你用括号包裹对象字面量(比如() => (<div>Content</div>))而无需显式写return。
内容的提问来源于stack exchange,提问作者hoan
相关产品推荐
相关产品推荐

