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.

Event BeforeInstallPromptEvent

Hàm tạo

BeforeInstallPromptEvent() Không chuẩn Thử nghiệm

Tạo một đối tượng BeforeInstallPromptEvent mớ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.platforms Read 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.userChoice Read 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"install". Ban đầu nút này bị ẩn.

html
<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 BeforeInstallPromptEvent và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.
js
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 installPrompt và tự ẩn đi lần nữa.
js
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