Khác nhau giữa preventdefault và stoppropagation và return false

      15

React uses synthetic events to lớn handle events from button, input & form elements. A synthetic event is a shell around the native DOM event with additional information for React. Sometimes you have to use event.preventDefault(); in your application.

Bạn đang xem: Khác nhau giữa preventdefault và stoppropagation và return false


The danh sách component example is taken from this tutorial about state management in React which uses React hooks. It demonstrates how to địa chỉ an công trình to a danh mục by using a khung element with input & button elements. In this case, a preventDefault is called on the sự kiện when submitting the form to prevent a browser reload/refresh. You can try the code yourself with & without the "prevent default".

Why is a khung submit reloading the browser? All native HTML elements come with their internal native behavior. For instance, đầu vào elements store their internal state. That's why often React is used to take over for having controlled components by managing the state via React. The same applies for a form element which has a submit sự kiện that is invoked via a submit button element. In the past, it was desired to lớn refresh the browser to lớn flush all state and to submit the data to a backend. Nowadays, a library such as React, gives us more flexibility to khuyễn mãi giảm giá with the submit event ourselves. In this case, we khuyến mãi with it by updating the menu in our component's state.

In another scenario, you may fetch data from a backend và store it in your component's state. There is no native submission from the size expected anymore, that's why the developer is able to lớn take over. The developer shouldn't need to worry about any undesired behavior of the browser.

Xem thêm: Cách Xóa Tài Khoản Skype Trên Điện Thoại, Web, Cách Để Xóa Tài Khoản Skype: 11 Bước (Kèm Ảnh)


*
*

How khổng lồ create a React Button

A button may be the first interactive element that you are using in a React component. Therefore, this is a short React tutorial by example for beginners about creating a button in React, how khổng lồ use…


*

*

React sự kiện Handler

In this React tutorial, we will get to know event handlers in React for HTML elements such as button and input elements. You will learn how to use a button with its onClick event and how to define and…


*

*

The Road to React

Learn React by building real world applications. No cài đặt configuration. No tooling. Plain React in 200+ pages of learning material. Learn React lượt thích 50.000+ readers.


Get the Book 


Get it on Amazon.

Take Part

Never miss an article about website development và JavaScript.


Join 50.000+ Developers

hotlive |

Hi88