Javascript reactjs中组件内部的函数

我有以下代码片段

return (
   <InputMask
         mask="99:99"
         *some other prop*
   >
    {(inputProps) => (
         <Input
            {...inputProps}
            onSubmit={*Does something*}
          />
   </InputMask>)

返回(
{（inputProps）=>(
)

这是一个自定义组件的返回，我的问题是关于语法…如何在组件内定义函数？在呈现此组件时是否调用此函数？向此函数传递了什么（在本例中，InputProps是如何传入的，它包含什么内容）

---

正如您可以推断的，我对前端开发非常陌生，通常会做出反应，因此任何对文档的指导或参考都会非常有帮助！

首先，请快速定义。以下是一些我使用儿童的JSX：

重要的是，与其他任何东西一样，子对象也只是一个道具。它可以是您想要的任何东西，包括一个函数。如果一个组件想要向其未知的子对象提供一些信息，这一功能可能特别强大。一个很好的例子是某种迭代器：

<Loop over={[1,2,3]}>
   {item => <span>{item}</span>}
</Loop>

从本质上讲，这就是您所拥有的——就函数何时运行以及inputProps对象是什么而言，这完全取决于InputMask组件，但它几乎肯定会在渲染时运行它。

谢谢：）我想我现在明白了！基本上，里面的函数是组件的子级，inputmask可以使用这个子级，无论它是函数还是其他组件，inputProps只是一个任意变量，它的使用方式完全取决于inputmask的实现方式。

render(){
   return <div className="my-component">{this.props.children}</div>;
}

<Loop over={[1,2,3]}>
   {item => <span>{item}</span>}
</Loop>

render(){

   // For each item in the 'over' prop, call this.props.children
   return this.props.over.map(this.props.children);

}