BeforeInstallPromptEvent
Khả dụng hạn chế
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.
BeforeInstallPromptEvent là giao diện của sự kiện beforeinstallprompt được kích hoạt trên đối tượng Window trước khi người dùng được nhắc "cài đặt" một website lên màn hình chính trên thiết bị di động.
Giao diện này kế thừa từ giao diện Event.
Hàm tạo
BeforeInstallPromptEvent()Không chuẩn Thử nghiệm-
Tạo một đối tượng
BeforeInstallPromptEventmới.
Thuộc tính thực thể
Kế thừa các thuộc tính từ đối tượng cha của nó, Event.
BeforeInstallPromptEvent.platformsRead only Không chuẩn Thử nghiệm-
Trả về một mảng các chuỗi chứa những nền tảng mà sự kiện được gửi tới. Điều này được cung cấp cho các user agent muốn đưa ra cho người dùng lựa chọn giữa nhiều phiên bản, chẳng hạn như "web" hoặc "play", để người dùng có thể chọn giữa phiên bản web hoặc phiên bản Android.
BeforeInstallPromptEvent.userChoiceRead only Không chuẩn Thử nghiệm-
Trả về một
Promiseđược resolve thành một đối tượng mô tả lựa chọn của người dùng khi họ được nhắc cài đặt ứng dụng.
Phương thức thực thể
BeforeInstallPromptEvent.prompt()Không chuẩn Thử nghiệm-
Hiển thị một lời nhắc hỏi người dùng xem họ có muốn cài đặt ứng dụng hay không. Phương thức này trả về một
Promiseđược resolve thành một đối tượng mô tả lựa chọn của người dùng khi họ được nhắc cài đặt ứng dụng.
Ví dụ
Trong ví dụ sau, một ứng dụng cung cấp nút cài đặt riêng của nó, có id là "install". Ban đầu nút này bị ẩn.
<button id="install" hidden>Install</button>
Trình xử lý beforeinstallprompt:
- Hủy sự kiện để ngăn trình duyệt hiển thị giao diện cài đặt riêng của nó trên một số nền tảng
- Gán đối tượng
BeforeInstallPromptEventvào một biến để có thể dùng lại về sau - Hiển thị nút cài đặt của ứng dụng.
let installPrompt = null;
const installButton = document.querySelector("#install");
window.addEventListener("beforeinstallprompt", (event) => {
event.preventDefault();
installPrompt = event;
installButton.removeAttribute("hidden");
});
Khi được nhấp, nút cài đặt của ứng dụng:
- Gọi phương thức
prompt()của đối tượng sự kiện đã lưu để kích hoạt lời nhắc cài đặt. - Đặt lại trạng thái bằng cách xóa biến
installPromptvà tự ẩn đi lần nữa.
installButton.addEventListener("click", async () => {
if (!installPrompt) {
return;
}
const result = await installPrompt.prompt();
console.log(`Install prompt was: ${result.outcome}`);
installPrompt = null;
installButton.setAttribute("hidden", "");
});
Khả năng tương thích với trình duyệt
Xem thêm
- Làm cho PWA có thể cài đặt
- How to provide your own in-app install experience trên web.dev (2021)