ở sao React hook lại tồn ở trên trái đất này?React hook tồn ở trên trái đất này có lợi ích gì không?
Lịch sử
Tháng 5, 2013
Nếu bạn còn nhớ về cách viết một component trong React bằng React.createClass, chứng tỏ bạn đã là già làng trong React, ngày mới ra đời khi javascript không hề có khai báo class, chúng ta sẽ khai báo component như thế này
const ReposGrid = React.createClass({ getInitialState () return , componentDidMount () , componentDidUpdate (prevProps) , render() { return (
Tháng giêng, 2015
Tổ chức Ác ma thế giới công bố chuẩn EcmaScript 2015, còn gọi với tên thân thương ES6. class chính thức có mặt trong javascript. Đội ngũ phát triển của React lúc đó kết luận, chúng ta không cần phát minh lại cái bánh xe (don’t reinvent the wheel), cứ xài theo chuẩn đã có. Thế là từ đó chúng ta khai báo component bằng class extends
class ReposGrid extends React.Component { constructor (props) super(props) this.state = repos: <>, loading: true this.updateRepos = this.updateRepos.bind(this) componentDidMount () componentDidUpdate (prevProps) render() { return (
Khi khai báo component bằng class, chúng ta khởi tạo tổng giá trị của state bên trong phương thức constructor và nó sẽ được nhét vào trong this. mặc khác, với cách khai báo đã quốc tế hóa của class, nếu chúng ta extends từ một class, chúng ta phải gọi super() trước khi khả năng dùng this. Và riêng với React, chúng ta còn phải truyền thêm props vào trong super. Các bạn lập trình viên phát bệnh vì cách viết chướng mắt này.
Bạn đang xem: Hook là gì
Giải quyết
Từ React 0.14 chúng ta có 2 cách tạo component, dùng class hoặc dùng function. Nếu cần state và các lifecycle thì dùng class, nếu chỉ nhận props rồi trả về UI thì dùng function. Đó là phương pháp chúng ta được dạy.
Bác CTO John Carmack nói, em xin lỗi sửa câu văn của bác chút
Tụi bây dẹp phương thức, class, framework hết dùm tao cái, Dùng hết function đi
React team, chân lý đây rồi, chúng ta tìm cách biến function component đáp ứng được những gì class component làm được đi.
Xem thêm: Bartender Là Gì – Vai Trò Và Nhiệm Vụ Của Bartender
Với function component, chúng ta chả cần lưu tâm tới super(props), this chạy thế nào. Chúng ta sẽ bổ sung state, giải quyết lifecycle, chia sẻ logic nữa là xong.
Và thế là các hook của React ra đời: useState, useEffect, custom hook
Để dùng state, chúng ta dùng hook là React.useState
function ReposGrid ( id ) const < repos, setRepos > = React.useState(<>) const < loading, setLoading > = React.useState(true)function ReposGrid ( id ) const < repos, setRepos > = React.useState(<>) const < loading, setLoading > = React.useState(true)
Lifecycle thì khả năng bạn sẽ buồn (hoặc vui) khi nghe tin này. Nếu bắt đầu dùng React hook, function component, dẹp hết những gì bạn đã từng biết về lifecycle của component đi, quên đi những việc cần làm ở giai đoạn này, giai đoạn kia của component. Bạn hay tiếp cận cách tư duy khác hoàn toàn Đồng bộ hóa
Thử nghĩ những gì bạn làm ở một sự kiện của lifecycle, khả năng là đổi state, fetch dữ liệu, cập nhập DOM, tất cả đều gom về một mục đích duy nhất Đồng bộ hóa. Những gì chúng ta cần đồng bộ thường là những thứ nằm ngoài React (gọi API, DOM, đại loại như thế) với những thứ bên trong React (state) hoặc ngược lại.
Xem thêm: Google Play Trò Chơi
Vì sao React Hooks lại được dùng nhiều trong các dự án đến thế?
Thật không thể tin được bạn khả năng khai báo và setState bên trong một function bình thường. Chúng ta đã có một React mạnh mẽ với các đặc tính sau
đơn giản hóaĐóng góiLinh độngMở rộng
Không những giải quyết vấn đề đang có, như cách mà các bạn làm marketing cho React tuyên truyền: dùng Hook để có state bên trong function component. Thật ra nó còn mang tới những tổng giá trị to lớn khác là tăng khả năng tái dùng và kết hợp logic.
Chuyên mục:
Các câu hỏi về Hook là gì – WEB GIẢI ĐÁP
Nếu có bắt kỳ câu hỏi thắc mắt nào vê Hook là gì – WEB GIẢI ĐÁP hãy cho chúng mình biết nha, mõi thắt mắt hay góp ý của các bạn sẽ giúp mình nâng cao hơn hơn trong các bài sau nha <3Bài viết Hook là gì - WEB GIẢI ĐÁP ! được mình và team xem xét cũng như tổng hợp từ nhiều nguồn. Nếu thấy bài viết Hook là gì - WEB GIẢI ĐÁP Cực hay ! Hay thì hãy ủng hộ team Like hoặc share. Nếu thấy bài viết Hook là gì - WEB GIẢI ĐÁP rât hay ! chưa hay, hoặc cần bổ sung. Bạn góp ý giúp mình nha!!
Các Hình Ảnh Về Hook là gì – WEB GIẢI ĐÁP
Các từ khóa tìm kiếm cho bài viết #Hook #là #gì #WEB #GIẢI #ĐÁP
Tra cứu thông tin ở WikiPedia
Bạn khả năng xem thêm nội dung về Hook là gì – WEB GIẢI ĐÁP từ trang Wikipedia.◄source: https://so1vn.vn/
Xem thêm các bài viết về giải đáp ở : https://so1vn.vn/hoi-dap/
Trả lời