您如何知道何时停止在React组件中应用单一责任原则？

Question

在ReactJS中，我明白了SRP。但我认为我认为这是错误的方式。我的问题是我不知道何时停止关于SRP。与Thinking in React中的示例相同。我可以很容易地说ProductRow组件可以进一步细分为：

• ProductRow - 为每个产品显示一行
  • ProductRowName - 显示每个产品行的名称
  • ProductRowPrice - 显示每个产品行的价格

我现在的问题是，你怎么知道什么时候SRP足够了？你的暗示是什么？我希望了解dev devs的反应，以便将其应用到我的代码上。

Answer 1

功能第一。

反应的好处在于它如何处理代码的可重用性。你想尽可能地利用它。为了做到这一点，我认为和这个例子对你的改变都达不到真正的目标。

ProductRow的功能是什么？它意味着接受一个对象，然后输出一个包含该对象信息的表行。

如果我们确切地定义对象是什么，或者确切地应该输出对象的哪些部分，那么我们就把自己装进了一个角落。 var Row = React.createClass({ render: function() { var item = this.props.item; var columnNames = this.props.columnNames; return ( <tr> {columnNames.map(function(columnName){ return <td> {item[columnName]} </td>; })} </tr> ); } }); //USAGE: <Row item={product} columnNames={['name', 'price']} /> 现在只能用于产品对象，并要求这些对象具有名称和价格属性。

我们可以删除一些特异性吗？我们是否可以制作一个单一责任的组件，但不指定其输入的形状？

当然！

set_of_integers = set(array_of_integers)

for input_item in input:
    if input_item not in set_of_integers:
        print(input_item)

现在失败的是我们不再有每列的唯一格式（红色名称取决于库存状态）。但 是我们实际遇到SRP问题的地方。是时候制作第二个组件，谁负责根据输入条件创建一个颜色图。