react 関数を子コンポーネントに渡せない

子コンポーネントに関数が渡せない

親コンポーネント

const searching = (e) => {
    console.log(e.target.value)
    setSearchName(e.target.value)
  }
 return (
        <BasicTextFields
        click={searching} 
        />
)

子コンポーネント

export default function BasicTextFields(props) {
  const classes = useStyles();

  return (
      <TextField className={classes.root}
      onChange={(e)=> {props.click.searching(e)}}
      id="outlined-basic" label="Search here" variant="outlined" />
    
  );
}

何回やっても searching 関数が実行されない

コンソール上のエラーは

BasicTextFields.js:21 Uncaught TypeError: props.click.searching is not a function

上手く関数が渡せていないよう

関数を渡す箇所の{ } を二重にした

const searching = (e) => {
    console.log(e.target.value)
    setSearchName(e.target.value)
  }
 return (
        <BasicTextFields
        click={{searching}}  (←ここ)
        />
)

多分 { } が一重だとただ文字列が渡されるだけになる

二重にすることで関数っていうのが認識されるんだと思う