Khi thay đổi URL trong ReactQuery thì sẽ tự động refetch hay sao ạ?

99 lượt xem

profile picture

Ẩn danh

Ngày 30 Tháng 05

Công ty mình mới bắt đầu sử dụng react query Với code ban đầu của công ty thì các page khác nhau vẫn gửi request cùng một api và nhận dữ liệu về. Dữ liệu nhận về là loại dữ liệu hầu như không có thayd dổi nên mình định dùng chức năng caching của react-query để ngăn ngừa các yêu cầu api không cần thiết. Nhưng khi kiểm tra tại tab network của dev tool thì mỗi lần url của page thay đổi vẫn gửi yêu cầu api dù trạng thái của data đang là fresh luôn. Mình đã set staleTime là 60 phút, và cũng kiểm tra chắc chắn luôn trạng thái data luôn fresh. Nên mình nghi ngờ liệu khi đổi url (ex localhost:3000/main -> /setting) thì sẽ tự động refetching và ko hề liên quan gì đến giá trị của option luôn? Mình muốn ngăn chặn refetching khi trạng thái data là fresh

Đánh giá câu hỏi ngay!

Hãy ấn Up Vote với những câu hỏi cụ thể và chi tiết

Hãy ấn Down Vote với những câu hỏi chưa rõ ràng Careerly sẽ nhắc người hỏi chỉnh sửa lại.

2 câu trả lời

BEST

Ảnh đại diện của Thy

Lỗi tự động refetch mỗi lần thay đổi url thường không liên quan đến option refecthOnMount đâu. Về cơ bản thì React Query caching và quản lý theo key và khi thay đổi URL thì không ảnh hưởng gì đến key hết. Vì vậy dù bạn có thay đổi URL đi chăng nữa thì trong trường hợp có data đã được caching thì nó sẽ ko yêu cầu thêm dến server và sử dụng data đã được cache. Bạn thử kiểm tra trên react dev tools hoặc profiler xem thử component có đang re-rendering hay không. Khi thay đổi URL thì bạn nên kiểm tra xem tại HOC có bị rendering hay không, hoặc khi URL thay đổi thì xem thử giá trị khai báo tại key trong query (thường là state value) có bị thay đổi hay không nữa.

Ảnh đại diện của Manh Do

Bạn có thể tạo một minimum reproducible codesand box cho lỗi này ko?

Đăng ký ngay bây giờ để đọc toàn bộ câu trả lời!

Cộng đồng lập trình viên sẽ giải đáp tường tận cho bạn.

Xem thêm

Đồng ý với Điều khoản dịch vụ Chính sách bảo mật của Careerly

Bạn đã có tài khoản rồi?

Đăng ký ngay bây giờ để đọc toàn bộ câu trả lời!

Cộng đồng lập trình viên sẽ giải đáp tường tận cho bạn.