Effects trong React

Trước khi xem xét việc áp dụng hook useEffect, chúng ta cần hiểu effects trong React là gì.

Effects hay tác dụng phụ (side effects) là các hành động bổ sung, cho phép một component kết nối và đồng bộ hóa với các hệ thống bên ngoài.

Các hệ thống bên ngoài được hiểu là những đoạn mã hoặc phần ứng dụng không nằm dưới sự kiểm soát của React. Ở đây bao gồm làm việc với mạng, DOM của trình duyệt, animation, các widget được viết bằng cách sử dụng thư viện UI bên thứ ba, và các ứng dụng khác, không được tạo bằng React.

Effects cho phép chạy mã sau khi render, do đó tạo cơ hội đồng bộ hóa component của bạn với các hệ thống bên ngoài React.

Effects có thể được thực thi vào lúc component được render lần đầu, vào lúc giá trị được theo dõi thay đổi hoặc khi vòng đời của component kết thúc.

Cần nhớ rằng effects là một loại "cửa sập" khẩn cấp để thoát khỏi React, không nên lạm dụng chúng.