react 有状态组件最佳实践？

• Z时代
• 2024-01-10
• 分类：技术分享

<Father>
<Modal {...modalProps}></Modal>
</Father>

• 页面如上，由普通页面+弹窗组件构成；

• modal组件是个复杂的组件：

  1. 内部状态既受Father影响，又可以在Modal自身改变；
  2. Modal还需要post,get操作；
  3. Modal需要用在多个不同的Father里面；

如何设计比较优雅，既能满足子组件modal的通用性，又不需要在各个父组件中复制粘贴一大堆预处理逻辑

回答

如果逻辑过于复杂，就不建议把所有逻辑都放在一个组件里。过度复用，会使代码丧失扩展性和可维护性，一旦业务发生变更，将是极其头痛的问题。建议你根据不同业务，多写几个modal，尽量让每个modal只做一件事，这才是组件化的最终目的。不能为了复用而复用，相较复用而言，代码的可维护性和扩展性优先级应该更高。

参照上图写法，其目的减少Modal逻辑，在页面中处理相关逻辑

以上是 react 有状态组件最佳实践？ 的全部内容， 来源链接： utcz.com/a/39321.html