React组件中建议使用多少道具



关于React组件中应该有多少道具是最好的,你有什么建议吗?我知道道具的数量没有严格的规定,我正在寻求经验开发人员的建议,以使代码干净易读(我的意思是"最好"(。

我觉得道具的数量与其他语言中的参数数量相似。在PHP中,有些人建议使用<=5个参数。React呢?

关于道具的数量,你有什么方法可以减少吗?

感谢

请注意,这是唯一的美学问题,您可以发送任意多的参数,但也有最佳实践。

正如你所说,它就像函数的参数。道具就是参数。我建议使用尽可能少的,只要它是可读的。

有时,有两个参数(props(甚至可能会让人困惑,比如你把agesystemConfig发送到一个组件,这些props是不相关的,可能会让将来研究它的开发人员感到困惑(这可能是你(

有时,拥有7个道具是可以的,因为它是可读的,并且都在同一个域中。例如:您可以发送许多个人属性,如ageheightweight等,它将是完全可读的。

此外,你可能会说,好吧,如果我为那个person组件发送50个参数,在这种情况下,你可能最好按原样发送Person对象,并让组件";"挖";到对象中,并获取它所需的所有变量。

我遵循这个经验法则:三个道具就可以了。五个道具是一种代码气味。超过七个道具是一场灾难

当然,这不是通用的解决方案,但我的建议是,您必须保持组件的清晰和易于维护。如果道具的数量使组件膨胀,那么你已经达到了极限。

适当的构图应该有助于避免道具通过多个组件。尝试在组件树中尽可能低的点处理事件。

还要记住,如果组件本身有很多道具,那么要么:

  1. 每个组件都做得太多,和/或
  2. 您的组件对其子代了解过多,管理过多

事实上,道具的数量与最佳实践和干净的代码几乎没有联系。例如,一个蚂蚁设计组件有9个以上的道具,这并不意味着蚂蚁设计没有干净的代码、最佳实践等,。。等等。如果你用子组件实现一个通用组件,以便在应用程序中使用可用的位置,你必须传递子组件所拥有的大部分道具,它很可能会有5个以上的参数。

因此,重要的是你应该有一个通用的代码方式,一个头脑。执行背后是否有一种思路,是否清晰易懂;计数对于其他(好的(代码评审员来说是没有意义的。

最新更新