javascript - React 组件返回 jsx 以外的东西

Question

我正在尝试重构其他人编写的一些代码，并且想知道以下是否可行。我可以创建一个返回非 html 或 jsx 的 react 组件吗？并返回一个函数什么的？

到目前为止，该组件基本上包含 4 个函数，然后是一个返回 block ，该 block 返回一些已渲染的 jsx

我想将其中的 2 个函数提取到它们自己的组件中，因为它们相似并且可以重用

但是，这些函数只是进行 ajax 调用并调用其他函数，而不是返回任何 jsx。他们还需要里面的 Prop ，并且需要传入或连接到 redux 商店的 Prop 它调用的一些函数是调度函数，因此必须连接到 redux 存储。所以我不能构建一个独立的函数

这有意义吗，还是我遗漏了什么。下面的伪代码来演示:

const component = ({...props}) => {
   const func1(){
     prop1()
     try{

     } catch(){
      callingAnotherProp()
     }
   }

   const func2(){

   }

   const func3(){

   }

   const func4(){

   }
}

假设 func1 和 func2 是相同的。正如您所看到的，他们不会返回任何 jsx，只是进行进一步的调用。我不认为我可以隔离成 sep 函数。我宁愿不将 props 作为 args 传递，而只是将函数连接到 redux 存储并以这种方式使用 props。这可能吗？

Answer 1

HOC 呢？您可以使用 func1() 方法创建一个组件，该组件的 render 函数将只返回 {this.props.children}。

另外两个选项是独立函数(你不喜欢)和继承(我不喜欢)。