Use Event Handlers with React

React

Share this video with your friends

In this lesson, we'll learn about React's synthetic event system which allows React to use the same event system regardless of the platform (whether you're using react-native or react-dom for example). We'll see how to attach events directly to elements and React takes care of event delegation and optimization for you. We will look at some of the event handlers for an HTML button and go over the onChange event handler for an HTML input.

Georgios Karametas

~ 7 years ago

Hi Kent!

Thanks for the great content, as always! I have to make a question though.

According to this: https://egghead.io/lessons/react-redux-avoiding-object-mutations-with-object-assign-and-spread

using Object.assign like you do in your setState function mutates the original state object, right?

Shouldn't you be using Object.assign({}, state, newState) instead, and if not why?

Thanks for the content again, I am a huge fan!

Kent C. Dodds(instructor)

~ 7 years ago

Hi Georgios! You're totally right! But you're also getting ahead of the content 😉 We haven't gotten into React state yet, so I'm manipulating just a regular object. In the course I want to slowly introduce concepts, so we start with this and the next lesson is about React state :)

Sai Kota

~ 7 years ago

Hi Kent,

i really liked the online editor model of learning, focus just the concepts & not the entire workspace.

can you share the online editor link for this code.

Thanks !

Kent C. Dodds(instructor)

~ 7 years ago

Hi Sai! I get this question a lot! I recorded a video for my answer: https://github.com/kentcdodds/ama/issues/341

Panks A

~ 6 years ago

I keep getting error- Uncaught ReferenceError: process is not defined

Mustafa

~ 6 years ago

The jump between each of these lessons is quite large. For example, this video goes into "state" without even explaining what it is. I'm also finding the pace to be quite fast that it's difficult to internalize these lessons.

engine2

~ 6 years ago

Typo fix: Transcript, first code, missing ',' after <App /> in render:

ReactDOM.render(
	<App />
	document.getElementById('root'),
)

should be

ReactDOM.render(
	<App />,
	document.getElementById('root'),
)