将道具传递给 onClick function 得到错误 function 得到值字符串

Question

I'm trying to pass a props to other file and active some function in there

<CustomHtml NameF="Print"/>

this is in App.js

if we go to CustomHtml Function!

function CustomHtml({NameF}){
  
 function Print(){
 consol.log("Hi)
 }

    return(

        <button onClick={NameF}>Click Me<button />
      )
    } 
  export default CustomHtml 

and then i got this error saying " onClick listener to be a function, instead got a value of string type. "

Answer 1

Error is valid you are passing "Print" string as prop. If you want to pass Print function as callback, you should change the component as

<CustomHtml NameF={Print}/>

Also, Print function should be accessible in the component where CustomHtml component is used.