reactjs - 如何使用扩展运算符使用作为道具传递的函数

Question

如何使用 React 中使用扩展运算符作为道具传递的另一个组件中的单个函数。

const Component=(props)=>
{
  const A=()=>  
   {  
    }
  const B=()=>
    {
    }
  render(){
         return(
                <Anothercomponent RenderChild={(props)=>{<Component {...props} />}}
                );
          }
 }


const Anothercomponent=()=>
   {
       render(){
       const {RenderChild} = this.props;
       return(

                 //how to consume function A here
              );
    } 

标签： reactjs

Answer 1

首先，你还没有通过 functionA和Bas props

其次，您正在使用功能组件，因此您可以从函数参数而不是this.props. 它还需要使用渲染方法。如果使用渲染，则需要将组件定义为类组件

const Anothercomponent=(props)=> {
    const { RenderChild } = props;
    return(
        <div>Another component</div>
    );
}

const Component=(props)=> {
   const A=()=> {}
   const B=()=> {}
   return(
        <Anothercomponent RenderChild={(props)=>{<Component {...props} />}}
  );
}