call props function with parmeters from child-CodePudding

I want to call function with paramter from child compponent, i pass the function as a props and when i call this function its get to her but the paramter that i pass to the function is undiffend.

how can i call this function and send to her parmetrs?

here is my code:

perent function:

  async function doSomething(param){
//here i see in debug that param is undiffend
var do = param*2
console.log(do)
}

the call of the child componnet:

<child doSomething ={()=>doSomething()}/>

child:

export default function child(props) {
    const { doSomething} = props;
return (
            <div  onClick={() => doSomething(3)}>
           <button></button>
            </div>
    
)
 }

CodePudding user response：

Pass the function as a reference:

<Child doSomething={doSomething} />

or proxy the args through if you want to keep the anonymous callback function:

<child doSomething ={(...args) => doSomething(...args)} />

Child invokes the function and passes arguments:

export default function Child(props) {
  const { doSomething} = props;
  return (
    <div onClick={() => doSomething(3)}>
      ....
    </div>
  );
}

CodePudding user response：

you do not need to call function when passing into child component just type like this:

<Child doSomething={doSomething}/>