Learn

Great! You just passed a function from <Talker /> to <Button />.

In the code editor, select Button.js. Notice that Button renders a <button></button> element.

If a user clicks on this <button></button> element, then you want your passed-in talk function to get called.

That means that you need to attach talk to the <button></button> as an event handler.

How do you do that? The same way that you attach any event handler to a JSX element: you give that JSX element a special attribute. The attribute’s name should be something like onClick or onHover. The attribute’s value should be the event handler that you want to attach.

Instructions

1.

In Button.js, add an onClick attribute to the render method’s <button></button>.

The onClick attribute’s value should be the passed-down talk function. Since you named your prop talk in the last exercise, you can access this prop via this.props.talk.

Click Run. Once the browser refreshes, click on the button. Ew, how annoying!

Take this course for free

Mini Info Outline Icon
By signing up for Codecademy, you agree to Codecademy's Terms of Service & Privacy Policy.

Or sign up using:

Already have an account?