How is event processing implemented in React?

Asked 2 years ago, Updated 2 years ago, 98 views

If you create a __Handle method to handle an event in React Component, you can pass the event to the parameter I understand that you take the value of the parameter and process it.

handleEvent = (e) => {
    this.setState({
        state1 = e.target.value
    })
}

It's roughly the same shape as above.

But I'm curious about the structure of the object that corresponds to e over there. For example, I want to know the structure of how an event called click goes through a path to become the object that created the data and its value goes to the method.

I checked the inherited interfaces when processing events like SyntheticEvent, but whether there is no implementation or I don't understand... It's so hard ㅠ<

I think we can look for a part I'd appreciate it if you could give me that much advice

react

2022-09-22 14:16

1 Answers

According to the Synthetic Event Reference Guide ,:

The event handler that you create is passed on to an instance called SyntheticEvent, which is a wrapper instance that has cross-browsing of the browser's own event.

In short, SyntheticEvent only solves the cross-browsing problem, and ultimately is just an existing JS-browser event object. Therefore, I think you should look for the JavaScript event itself to get the answer you want. Start with MDN's Introduction to JS Events.

Sometimes when you look at the event handling function, you can see the variable designated as event or evt or just e. This is called event object, which is automatically handed over to the event handler and provides additional functionality and information.


2022-09-22 14:16

If you have any answers or tips


© 2024 OneMinuteCode. All rights reserved.