0
Khác nhau giữa class component và function component
với cùng state như nhau, mình muốn xem state đã thay đổi như thế nào sau khi setstate, nhưng tại sao có sự khác nhau giữa class component và function component sau khi setstate với syntax như nhau vậy mọi người.
Thêm một bình luận
3 CÂU TRẢ LỜI
+1
với class component khi bạn gọi setState
bạn có thể update từng trường trong state
, còn với hook thì khi bạn gọi setUser
là nó sẽ thay thế cả data cũ của bạn nhé
giải thích rõ hơn tí dx hk bn ơi, ko thì có thể gửi dùm mình document để mình tìm hiểu. Thanks bn.
+2
hi @tapcode
Với Class Component
- thuộc tính
state
sẽ đại diện cho toàn bộ trạng thái của Class - khi gọi hàm
setState
, nếu bạn update thuộc tính nào thì chỉ update lại cho thuộc tính đó, như trong vd của bạn gọithis.setState
chỉ set lại cho name thì age sẽ không đổi
Với Function Component
useState
được gọi là hook của React, bạn xem thêm ở đây https://reactjs.org/docs/hooks-reference.html#usestate- hook này sẽ trả về cho bạn một biến giá trị và một hàm để update lại giá của nó và render lại trên view
- Về bản chất thì nó chỉ là một variable có thể lưu string, number hay object. Trường hợp của bạn là lưu object với giá trị là
{name: 'a', age: 20}
. khi bạn gọisetUser
với object chỉ có name thì nó sẽ override lại object cũ - Bạn có thể tạo nhiều state bằng cách gọi hook này nhiều lần như sau
Thì trên view sẽ làconst [user, setUser] = useState({name: 'a', age: ''}) const [loading, setLoading] = useState(false) const [countClick, setCountClick] = useState(0)
<div> {loading && (<div>Loading....</div>)} <div>{countClick}</div> </div>
Hope this help ^^!