Móc vòng đời 'serverPrefetch' của Vue
Ví dụ
Sử dụng móc vòng đời serverPrefetch
để tìm nạp dữ liệu ở phía máy chủ.
export default {
data() {
return {
data: null,
};
},
async serverPrefetch() {
const response = await fetch("https://random-data-api.com/api/v2/users");
this.data = await response.json();
}
};
Định nghĩa và cách sử dụng
Móc vòng đời serverPrefetch
chỉ xảy ra trong quá trình hiển thị phía máy chủ (SSR).
Móc vòng đời serverPrefetch
được sử dụng để tìm nạp dữ liệu chẳng hạn, trong trường hợp bạn cần thực hiện việc đó riêng ở phía máy chủ.
Móc vòng đời serverPrefetch
được sử dụng như một hàm không đồng bộ, do đó nếu nó trả về một lời hứa, máy chủ sẽ đợi hiển thị thành phần cho đến khi lời hứa được giải quyết.
Lưu ý: Trong ví dụ trên, nút "Chạy ví dụ" bị thiếu vì ví dụ này không hoạt động vì hook serverPrefetch
sẽ chỉ được gọi trong quá trình hiển thị phía máy chủ (SSR).
Trang liên quan
Hướng dẫn về Vue: Móc vòng đời của Vue
Hướng dẫn JavaScript: JavaScript không đồng bộ