Một trong những bâng khuâng cho những bạn mới học ReactJS đó là có quá nhiều component life cycle, vậy sử dụng cái nào, sử dụng khi nào và có lưu ý gì khi sử dụng hay không?

Cùng mình xem hết video để giải đáp:
✅Bạn nên dùng component life cycle nào?
✅Mỗi life cycle sử dụng cho mục đích gì?
✅Nên né cái life cycle nào ra?
✅Lỗi nào thường gặp và cách fix?

Hi vọng những chia sẻ của mình từ video này sẽ giúp bạn code ReactJS tốt hơn. 😍
#reactjs #componentlifecycle #easyfrontend

Link tham khảo:
– Tài liệu trong video:
– Component life cycle:
– Cái diagram về life cycle:

—–
💻 Easy Frontend 🎉

Nơi kiến thức lập trình web frontend (html/css/javascript/reactjs) được chia sẻ một cách đơn giản, dễ hiểu mà đặc biệt là vui 😊 Với những tài liệu (tutorial) được biên soạn một cách kĩ lưỡng để giúp các bạn developer mới có thể nắm bắt vấn đề một cách nhanh chóng và hiệu quả. Từ đó nâng dần khả năng coding của các bạn lên theo thời gian.

❤️Ủng hộ mình làm videos thì góp 5k tại đây nhé:
– Ủng hộ tôi:
– MoMo/ZaloPay: 0901 309 729

Kết nối với mình:
– 🎉Facebook:
– 💻Github:
– 💼 LinkedIn:

Nguồn: https://abdevilliersfan.com

Xem thêm bài viết khác: https://abdevilliersfan.com/giao-duc/

33 Comments

Easy Frontend

June 15, 2020

Cảm ơn các bạn đã xem video của mình 😍
Bạn nào hiểu component life cycle rồi thì LIKE 👍
Thấy video hãy thì ❤️cho mình nhé!
Bạn học được gì sau video, bình luận bên dưới nhé!

Reply

phúc lê

June 15, 2020

vote bất đồng bộ a ơi

Reply

VoDucThang

June 15, 2020

Khi nào thì anh ra video bất đồng bộ trong javascript ạ

Reply

Nam Phan

June 15, 2020

anh có thể làm video về bất đồng bộ trong React js được ko ạ, có thể là bất đồng bộ trong lúc connect vs api server ạ

Reply

nhan ton

June 15, 2020

công nhận anh diễn đạt rất dễ hiểu

Reply

bauer

June 15, 2020

e xem video từ lúc public mà lúc đấy chưa đụng đến life cycle nên chưa thấm. giờ mới đụng nên xem lại là thấm rồi a. video a đầu tư và nói dễ hiểu lắm a. Thanks a lot!

Reply

Share TV

June 15, 2020

anh ơi anh làm clip giải thích giúp em bất đồng bộ và cách sử dụng cookies từ page login cho page home với ạ

Reply

anh duy

June 15, 2020

Anh ơi, vậy trường hợp khi ta muốn props có sự thay đổi thì sẽ update lại component thì sao ạ?

Ví dụ như em có chức năng sign up user (có dùng redux). Thì sau khi ấn nút submit form, em muốn hiện lên 1 popup, trong popup đó có 1 nút confirm. Nếu user ấn vào confirm thì mới call api để sign up user (component modal là 1 component riêng). Thì tức là khi ấn confirm thì sẽ thực thi 1 action để thay đổi 1 biến isConfirm trên store. Sao đó trong component Sign Up form em muốn kiểm tra khi nào biến isConfirm đó === true thì mới call api.

Vậy TH này thì sẽ xử lý bằng các Lyfecycle method ntn ạ?

Reply

Le Hung

June 15, 2020

thanks a, bai giang rat hay!

Reply

Kiên Đặng

June 15, 2020

Khoảng gần cuối video tầm 16:00 trở đi cái lỗi đó anh, nếu mình sử dụng Hooks thì fix làm sao ạ?

Reply

Nguyễn Tùng

June 15, 2020

series của anh giải thích dễ hiểu lắm ạ, chúc anh thành công

Reply

天道

June 15, 2020

hóng vid bất đồng bộ của a

Reply

Hòa Nguyễn

June 15, 2020

bất đồng bộ với đồng bộ anh ơii, hay quá <3

Reply

Vi vu duc

June 15, 2020

Anh giới thiệu về redux đi anh ! Cảm ơn anh ❤

Reply

Nguyễn Hoàng Minh

June 15, 2020

Trời đệt đi làm gần nữa năm rồi. Vô đây xem có mấy cái mình hiểu sai vãi lun. Cảm ơn anh nhiều nha.

Reply

Thien Duc

June 15, 2020

Anh ra chuỗi video về Redux đi anh ^^

Reply

Juhand Van.

June 15, 2020

Cám ơn anh nhiều, loạt video của anh rất thực tế ( vì hay đụng phải trong lúc làm dự án ) nên rất hữu ích ạ.
Anh cho e hỏi ở [16:00] anh dùng giải pháp:

B1: Khởi tạo biến isComponentMounted = false trong constructor();
B2: Set lại biến isComponentMounted = true trong componentDidMount để đủ điều kiện setState();
B3: Set lại biến isComponentMounted = false khi chuyển qua route khác.

Vậy tại sao ở B1 mình không thiết lập giá trị ban đầu của isComponentMounted = true luôn , như thế sang B2 mình đỡ phải mắc công set lại giá trị = true cho nó ?

Reply

I'm VuCms

June 15, 2020

Chào bác lại là e, e cũng đang xài componentWIllRecieveProps trong REACT NATIVE cũng hay bị thông báo warning không biết bao giờ sẽ loại bỏ hẵn, do là mình có dispatch một action từ component con để thay đổi state của container component, nhưng mình chỉ muốn animation lại container component chứ không muốn render lại toàn bộ, phải chăng trường hợp này vứt hết mấy đoạn xử lí trong componentWIllRecieveProps vào shouldComponentUpdate ?

Reply

i'm Doshi

June 15, 2020

https://stackblitz.com/edit/clickeditoutside
handle việc click outside để turn off dropdown .
nhưng viết như vầy kiểu tác động đến DOM không biết nên khắc phục như nào ấy a.
a có thể xem qua giúp em 1 lát với <3

Reply

Hải Huỳnh

June 15, 2020

Chào anh, em mới học react , em đang dùng redux thunk để gọi sử lý bất đồng bộ , nếu không sử dụng componentWIllRecievePróp thì làm sao phát hiện được props thay đổi vậy anh

Reply

Trung Duy Nguyễn

June 15, 2020

a ơi giờ e thấy ngta dùng Hooks nhiều, a có thể làm video về react Hooks đc ko a?

Reply

Vinh Trần Văn

June 15, 2020

Cảm ơn anh, nhưng e có 1 ý kiến, là nếu được a đặt tên các video của mình theo số thứ tự và có luôn tên channel a ở trên title. Để khi cần search lại ví dụ ( Easy Frontend bài 5 life cycle) là sẽ ra video của anh ngay mà ko trùng keyword với mấy kênh khác. Em rất cảm ơn với sự chia sẻ của a và chúc a thật nhiều sức khỏe ạ.

Reply

Scotlrip B

June 15, 2020

A chia sẽ 1 vài cách để hạn chế render khi không cần thiết đi a

Reply

FREE SOFTWARE

June 15, 2020

a giải thích redux dc ko ạ, e học chả hiểu gì ấy phần stateToProps() ấy a :))

Reply

Phước Quang

June 15, 2020

á há, thanks a nhe. Hổm giờ em bị Life Cycle dzật, sợ quá nên toàn né k dám nhìn mặt xD

Reply

Shen KN

June 15, 2020

Hi vọng anh có thêm video để em học hỏi. SUb anh ủng hộ.

Reply

Elrics Edward

June 15, 2020

hóng từ chiều trên group rồi 😀

Reply

Phạm Dũng

June 15, 2020

Em chào anh ạ.em có câu hỏi ạ.em chưa dùng setInterval trong componentDidMount bao giờ.theo em hiểu componentDidMount chỉ gọi một lần duy nhất khi hàm render được chạy.vậy anh cho em hỏi khi mà cứ trong 1s mình setState nhưng lúc đấy componentDidMount đã dừng lại thì có set lại state không và data trên trình duyệt có được cập nhật luôn sau 1s không ạ hay phải reload lại trình duyệt ạ.em không biết cách nói như nào cho dễ hiểu hơn.em đang đi làm thêm em không có máy tính để test.không hỏi thì lại ngứa ngáy trong người quá anh ạ.

Reply

Xuân Trọng

June 15, 2020

Hay quá a

Reply

Văn Tùng Phạm

June 15, 2020

hay lắm a ơi ! hóng tiếp cái bất đồng bộ js

Reply

Anh Kiệt Phạm

June 15, 2020

Bất đồng bộ luôn anh ei <3

Reply

Scotlrip B

June 15, 2020

like trc tính sau :))

Reply

tran duong

June 15, 2020

Lót dép hóng hihi

Reply

Leave a Reply