Passing functions as props to the rendered components

[Ahmed-Tarek94]

I was wondering if it is possible to pass functions as props to the rendered components <Masonry items={items} columnGutter={41} columnWidth={280} overscanBy={6} render={Post} className={classes.noOutline} /> In my case, the Post component needs to take a function in order to execute after certain event. Is it possible to do this? I tried modifying the items array and add the function as an attribute in the object but it didn't work

[jaredLunde]

Here's a thread that should help you

[Ahmed-Tarek94]

Thanks man! Much appreciated

[jaredLunde]

Happy to help!

[DLParkin]

@jaredLunde, really love this package but having the same issue as @Ahmed-Tarek94 but when I try go to the thread it will not allow me to read it. Are you able to make a note here what the outcome to the question was?

[jaredLunde]

@DLParkin

Thanks for the kind words. Nothing in the API but you have a couple options:

1. Use the React Context API
2. Wrap the card w/ useCallback() inside of your render function e.g....

   
   const CardWithClick = React.useCallback(
   props => <MasonryCard 
   {...props} 
   handleClick={() => setClickedId(props.data.id)}
   />, 
   []
   )

[DLParkin]

very grateful, thankyou