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>
)
}
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>
);
}
you do not need to call function when passing into child component just type like this:
<Child doSomething={doSomething}/>