响应放置辅助功能最佳实践

Question

我一直在努力将助手功能放置在React中一段时间​​（例如在组件内部或外部声明助手）。我一直在各地寻找最佳实践，却无法获得令人信服的东西。我已经尝试过这两种方法，但很难决定哪种方法更有利。我想知道人们在这个问题上是否有不同的想法。

在组件内部声明的受益助手功能：

• 可以使用道具和挂钩

骗局

• 使您的组件有点混乱
• 没有任何参数导致大量副作用的调用并不是特别有吸引力
• 不容易暴露在测试中

辅助功能在组件外部的优点：

• 容易暴露于测试中
• 也许更具说明性？

缺点：

• 丢失辅助函数的上下文，因为它们通常是为特定组件创建的
• 要求您在文件之间来回移动
• 不要干燥，因为道具和挂钩需要再次作为参数传递

Answer 1

恕我直言，把帮手放在外面。你的缺点不是缺点

• 如果助手是特定于组件的，则它不是助手。
• DRY原理是指重复逻辑而不是数据

Answer 2

如果您的辅助函数仅属于一个组件，并且甚至在不使用外部资源的情况下也未在外部使用，则仅将某种特殊的呈现逻辑视为组件逻辑。

如果您的辅助函数属于多个组件或项目，则您将打破DRY规则，重复代码，并可能添加不属于组件本身的逻辑。因此，有必要创建一个辅助函数外部组件，并将来自上下文和挂钩的值视为外部函数库的参数，可以在多个项目中重用。