ฝัง
- เผยแพร่เมื่อ 7 ก.พ. 2025
- Học useState - Series React Hooks 2021
React Hooks là một tính năng mới được thêm vào React từ phiên bản 16.8 giúp chúng ta có thể sử dụng các tính năng của React như life cycle, quản lý state trong functional components.
Nếu như các bạn đã biết về React Hooks nhưng chưa thực sự hiểu rõ về nó, cũng như thắc mắc lý do vì sao chúng ta phải sử dụng React Hooks hay nếu như các bạn chưa biết gì về React Hooks thì ở trong series này mình sẽ giải đáp các thắc mắc đó và giới thiệu cho các bạn các React Hooks phổ biến mà bạn nên biết thông qua các ví dụ đơn giản để từ đó các bạn có thể áp dụng ngay vào trong dự án của mình sau khi hoàn thành xong series này.
📕Resources
Học useEffect: • Học useEffect - React ...
Học useMemo: • Học useMemo - React Ho...
Học React JS cơ bản trong 30 phút: • Học React JS cơ bản tr...
💻 Thông số PC & Gears của mình (Affiliate Links):
Máy ảnh Canon EOS M50 + Kit 15-45mm - shorten.asia/b... (TIKI)
Microphones Elgato Microphone Wave 3 - shorten.asia/j... (TIKI)
Micro Rode Videomic Goshorten.asia/w... (TIKI)
Màn hình Dell S2421HN 23.8Inch IPS - shorten.asia/7... (TIKI)
Màn hình MSI OPTIX G27C4 27 VA 165Hz - shorten.asia/w... (TIKI)
Tai Nghe Gaming SteelSeries Arctis 7 DTS.X 7.1 - shorten.asia/E... (TIKI)
Chuột SteelSeries Rival 310 - shorten.asia/A... (TIKI)
Ổ cứng HDD Western Digital BLUE 6TB - shorten.asia/Q... (TIKI)
CPU Intel Core i5-10400 - shorten.asia/y... (TIKI)
Ram ADATA DDR4 XPG GAMMIX D10 8GB 3200MHz - shorten.asia/2... (TIKI)
Mainboard ASRock B460M - shorten.asia/G... (TIKI)
📢 Liên hệ với mình tại:
Facebook: /
Instagram: / holetex
Github: github.com/hol...
Facebook cá nhân: / minhtung09
Email: holetex@outlook.com
#reacthooks #reactjs #react #hooks #holetex #usestate
** Vấn đề về âm thanh **
Do có chút trục trặc kĩ thuật nên âm thanh của video này sẽ không được đều, sẽ có một vài đoạn âm thanh bị tăng/giảm. Các bạn hãy thông cảm cho mình nhé. Have a nice day! 😀
triệu like anh , mấy clip trước a làm cao siêu quá , hạ thấp xuống như thế này rồi mới lên cao đc
cảm ơn bạn đã chia sẻ những kiến thức hữu ích và dễ hiểu
lưu ý 1: 4:20
lưu ý 2: 6:15
lưu ý 3: 9:20
anh dạy hay quá. nhiều cái sâu mà mấy kênh khác ko nói tới
cảm ơn anh vì những video chia sẻ kiến thức chất lượng như này ạ=))
Cám ơn anh rất nhiều !!! Video quá hay, quá dễ hiểu
hay quá anh ơi..mong anh ra nhiều video như thế này về reactjs ạ
video quá hay và dễ hiểu ạ. em cảm ơn anh nhiều ^^
Hay a, e có góp ý là những chỗ lưu ý a nên viết chữ ra màn hình cho mọi người dễ hình dung hơn ý a, ví dụ lưu ý 1 là gì, lưu ý 2 là gì, lưu ý 3 là gì..... nó sẽ tổng quan hơn a ạ
Mong anh zai ra một Example App hoặc Project có integrate Life Cycles của React
Em đang muốn advanced-research để và hiểu rõ hơn về Life Cycles của React
A giang de hieu qua, day du nua. Thanks a
Hay quá. Đoạn cuối bạn có thể giới thiệu cách viết để 2 cách đổi sự khác biệt cho nhau đc ko?. Bên function thì ko bị xoá, còn bên class thì xoá và ghi đè lên.
hay quá anh HoleTex ơi..... Mong anh ra nhiều video chia sẻ kiến thức ạ
Cơ bản về redux với redux-saga đi anh !!! Cảm ơn anh nhiều ạ !!!
Hay đỉnh nóc kịch trần
like trước xem sau, chúc a nhiều sức khỏe
quá hay về dễ hiểu luôn anh ơi
video của a hay quá, cảm ơn a
Background hnay ok quá ạ ^_^
Hay qua nha anh ^^
Hay luôn ạ
hay lắm anh ạ
quá hay !
Anh ra list học react native đi anh
hay quá anh ơi
anh làm video về react-form-hook v7 đi anh
anh cho em hỏi ví dụ mình có 2 component A và B. B gửi giữ liệu C lên A. A lưu C vào state tại function x() rồi ngay tại functionX() này mình dùng state để xử lý thì lúc này nó lấy giá trị mặc định chứ chưa lấy giá trị mới setState. Mình giải quyết như nào ạ
anh dạy node js express js đi anh
Tuyệt
rat hay !
Thấy phải vào xem luôn :v
6:00 tại sao viết func thì lại handle được cái bất đồng bộ vậy anh? Khi viết func thì nó phải đợi func thực thi xong à anh?
Khi nào có series Redux anh ơi
React redux toolkit thẳng tiến anh ơi
Cho em hỏi trước khi có ReactHook thì ngta quản lý state bằng cách nào vậy anh
anh cho em xin font chữ anh xài được không ạ
a ơi cho em hỏi hàm setState trong useStage có phải là hàm bất đồng bộ ko ạ,hay nó ảnh hưởng bởi tính chất closure,mong a trả lời ạ,tks a !
Nó là bất đồng bộ em ạ
stackoverflow.com/questions/54069253/usestate-set-method-not-reflecting-change-immediately
@@holetex em cảm ơn ạ!
Anh ơi, hình như nếu dùng spread operator cho useState thì giá trị của state sẽ merge lại với nhau chứ không ghi đè lên ạ
setUser({...user,name:'updated'})
Ý của anh nói trong video là ghi đè lên giá trị state cũ
A có thể giải thích thêm tại sao dùng arrow function thì hàm initialValues k bị gọi lại được k ạ. Cám ơn a
Em có thể tham khảo khái niệm “Lazy initial state” từ tài liệu chính thức của React nhé
reactjs.org/docs/hooks-reference.html#lazy-initial-state
Về cơ bản thì đây là cơ chế hoạt động của React, khi component re-render lại thì toàn bộ code trong nó sẽ được chạy lại, kể cả đoạn code gán useState. Và việc truyền 1 function vào làm tham số của useState thì React sẽ làm giúp em việc đó là chỉ chạy hàm đó một lần duy nhất khi component được mount, từ các lần re-render sau React sẽ không gọi lại function này nữa.
@@holetex Cám ơn a
a ơi cho em hỏi có những phương pháp nào để quản lý state vậy ạ
Em có thể nói rõ hơn về câu hỏi của em không, anh chưa hiểu lắm
@@holetex ý bạn ấy có thể là trong 1 function hoặc class có nhiều hơn một state thì mong anh chia sẻ exp về quản lý state. (vd: về đặt tên, tách file quản lý state riêng....)
Có thể gán giá trị cho function như const a = initialValue() rồi useState(a) được ko anh ?
Em làm như vậy thì cũng bị issue đó em nhé. Nếu em khai báo và gán vào biến a như vậy thì ở bước này em cần sử dụng useMemo để biến a không bị gán lại giá trị sau mỗi lần re-render. Em đón xem video sắp tới về useMemo trong series này nhé
@@holetex Ok anh, à mà em dùng khai báo là const a vẫn bị gán lại giá trị hả anh. Với anh có thể làm thêm về React Hooks sử dụng cross component được ko ví dụ như các trang e-com thì ở homepage có product khi click sẽ add product đó vào [basket, setBasket] rồi khi qua trang checkoutpage sẽ gọi lại basket đó thì các bạn mới học sẽ dễ cảm nhận hơn. Btw em cũng thấy useEffect() hay đi với useState()