ReactJS - Cannot read property 'preventDefault' of undefined
You should bind this event to "handleClick()" function. As follows,
<GiphyButton onClick={this.handleClick.bind(this)}/>
Not the answer to my question, but I ended up changing the function to handleSubmit and passing this into a form, which my button sits in. This worked.
You should just pass function -handleClick
and not call it
render() {
return (
<BrowserRouter>
<main>
<Navbar />
<Header />
<GiphyButton handleClick={this.handleClick}/>
</main>
</BrowserRouter>
);
}
That was preventing event object to be passed causing undefined
error.
Change code for GiphyButton
with following to pass onclick method -
import React from 'react';
const GiphyButton = (props) => (
<section>
<button onClick={props.handleClick}>See more otters</button>
</section>
);
export default GiphyButton;