反应+反应 - 引导。最好是创建函数或精细编写函数作为属性

Question

我正在查看react-bootstrap组件站点，特别是<FormControl>组件。

为验证输入值是否正常，可以将其内联或作为函数写入吗？

例如，

<FormControl
  onChange={() => {this.setState({ /* do some ternary check here */ })}
/>

我在许多教程中都注意到，作者要么将大量的内容移到函数中（即onChange={this.doSomething}），要么有时候按照上面的方式进行操作似乎也是有意义的。

我怎么知道哪种方式更可取？

Answer 1

如果使用ternary operator，您可以验证input字段，然后将其写入内联，如果您想检查许多条件并想要进行一些计算，那么最好写一个{{1}将所有逻辑放在那里。

基本上，函数用于使您的代码更强结构化和可读，假设您要检查3个条件，因此如果您将这些条件内联写入，那么它将变得有点混乱，并且不会增加它function部分的大小，尽量保持渲染尽可能小，因为render是组件的起点，如果有人想检查你的代码，他会开始来自render所以这将有助于他轻松理解逻辑。

编写函数的另一个好处是，您也可以将它与其他相同类型的输入字段一起使用。

Answer 2

添加功能或创建功能是件好事。 这将是更好的因为使用函数可以随时随地调用函数，但如果你使用内联，那么每次你必须编写相同的东西，这使得代码更复杂和团结