DEV Community

liu550
liu550

Posted on

1 1

Cannot call a child component's function from the parent component. Error: “…is not a function”

Hi,

For my website I want to include a feature that helps users randomly click a link programatically. The event happens in the parent component called StreamingPlaza, and its has a list of children components called StreamingCard, each containing a streaming link. The attached screenshots are my code. I got the error "this.roomclicks.current[0].handleClick is not a function." I tried console.log(this.roomclicks.current[0]), and it did print out the StreamingCard child component. I looked through many relevant stackoverflow posts, and the answers suggested that this code was supposed to work. I would appreciate a lot if someone can tell me where I get it wrong. Thanks!

Alt Text

Alt Text

Top comments (0)

Sentry image

Make it make sense

Only the context you need to fix your broken code with Sentry.

Start debugging →

👋 Kindness is contagious

Explore a trove of insights in this engaging article, celebrated within our welcoming DEV Community. Developers from every background are invited to join and enhance our shared wisdom.

A genuine "thank you" can truly uplift someone’s day. Feel free to express your gratitude in the comments below!

On DEV, our collective exchange of knowledge lightens the road ahead and strengthens our community bonds. Found something valuable here? A small thank you to the author can make a big difference.

Okay