react JSX语法简化建议

ldfqzlk8  于 2022-10-28  发布在  React
关注(0)|答案(1)|浏览(134)

建议

我想建议增强JSX规范以允许:

return <button {onClick}>Text</button>

将被解析为等同于:

return <button onClick={onClick}>Text</button>

依据

这将提高可读性并缩短行长度,尤其是在使用多个与变量共享名称的属性时。
它还鼓励采用与预期的属性名相匹配的变量和函数名,例如function onClick(ev) {}而不是function clickHandler(ev) {},这增强了我自己项目中的可读性。(一旦采用了这种约定,本建议还减少了冗余,再次提高了整体可读性。)

当前解决方法

目前的解决方法如下所示,但并不十分完善:

return <button {...{onClick}}>Text</button>

其他建议

这个增强建议可以进一步用于允许任意数量的逗号分隔的参数扩展到同名的属性中:

<component {arg1, arg2, etc} />

...相当于:

<component {...{arg1, arg2, etc}} />

...也相当于“标准”语法:

<component arg1={arg1} arg2={arg2} etc={etc} />
pjngdqdw

pjngdqdw1#

目前的解决方案在我看来确实很好。我认为不值得花时间来实现您的建议;当存在简单的解决方法(并且不是太琐碎)时。)

相关问题