Skip to main content
Đây là tài liệu Inertia.js v1, phiên bản không còn được duy trì tích cực. Vui lòng tham khảo tài liệu v3.
Với Inertia, bạn xây dựng ứng dụng theo đúng cách quen thuộc với framework web phía máy chủ mà mình lựa chọn. Bạn tiếp tục sử dụng các chức năng sẵn có của framework cho routing, controller, middleware, xác thực, phân quyền, truy xuất dữ liệu và nhiều tác vụ khác. Tuy nhiên, Inertia thay thế tầng view của ứng dụng. Thay vì render phía máy chủ bằng các template PHP hoặc Ruby, các view mà ứng dụng trả về là những page component JavaScript. Nhờ đó, bạn có thể xây dựng toàn bộ frontend bằng React, Vue hoặc Svelte, đồng thời vẫn tận hưởng năng suất phát triển của Laravel hoặc framework phía máy chủ mà bạn ưa dùng. Như bạn có thể hình dung, chỉ đơn giản xây dựng frontend bằng JavaScript chưa đủ để mang lại trải nghiệm ứng dụng một trang. Nếu bạn nhấp vào một liên kết, trình duyệt vẫn sẽ thực hiện một lần tải toàn bộ trang, khiến framework phía client phải khởi động lại ở lần tải trang tiếp theo. Đây chính là lúc Inertia tạo ra khác biệt. Về cốt lõi, Inertia về cơ bản là một thư viện routing phía client. Nó cho phép bạn chuyển trang mà không buộc trình duyệt tải lại toàn bộ trang. Điều này được thực hiện thông qua component <Link>, một lớp bọc nhẹ quanh liên kết anchor thông thường. Khi bạn nhấp vào một liên kết Inertia, Inertia sẽ chặn sự kiện nhấp và thực hiện lần truy cập qua XHR. Bạn cũng có thể chủ động thực hiện các lần truy cập này bằng JavaScript thông qua router.visit(). Khi Inertia thực hiện một lần truy cập XHR, máy chủ nhận biết đây là request của Inertia và thay vì trả về một response HTML đầy đủ, nó trả về response JSON chứa tên page component JavaScript cùng dữ liệu (props). Sau đó Inertia sẽ thay thế động page component trước đó bằng page component mới và cập nhật history state của trình duyệt. Kết quả cuối cùng là trải nghiệm ứng dụng một trang mượt mà. 🎉 Để tìm hiểu sâu hơn về các chi tiết kỹ thuật bên trong cách Inertia vận hành, hãy xem trang giao thức.

​
Tài liệu chính thức

Bài dịch này được đối chiếu từ tài liệu Inertia.js v1 chính thức. Nếu có khác biệt do phiên bản hoặc cập nhật mới, hãy ưu tiên tài liệu chính thức làm nguồn tham chiếu.