BeforeInstallPromptEvent
非標準:此特性未標準化。我們不建議在生產環境中使用非標準特性,因為它們瀏覽器支援有限,並且可能會更改或被移除。但是,在沒有標準選項的特定情況下,它們可以是合適的替代方案。
BeforeInstallPromptEvent 是在使用者被提示將網站“安裝”到移動裝置主螢幕之前,在 Window 物件上觸發的 beforeinstallprompt 事件的介面。
此介面繼承自 Event 介面。
建構函式
BeforeInstallPromptEvent()非標準 實驗性-
建立一個新的
BeforeInstallPromptEvent物件。
例項屬性
繼承其父級 Event 的屬性。
BeforeInstallPromptEvent.platforms只讀 非標準 實驗性-
返回一個字串陣列,其中包含事件分派到的平臺。這供希望向使用者提供版本選擇的使用者代理使用,例如,“web”或“play”,允許使用者在 Web 版本和 Android 版本之間進行選擇。
BeforeInstallPromptEvent.userChoice只讀 非標準 實驗性-
返回一個
Promise,該 Promise 解析為一個物件,描述使用者在被提示安裝應用時的選擇。
例項方法
BeforeInstallPromptEvent.prompt()非標準 實驗性-
顯示一個提示,詢問使用者是否要安裝應用。此方法返回一個
Promise,該 Promise 解析為一個物件,描述使用者在被提示安裝應用時的選擇。
示例
在以下示例中,一個應用提供自己的安裝按鈕,其 id 為 "install"。最初,該按鈕是隱藏的。
html
<button id="install" hidden>Install</button>
beforeinstallprompt 處理程式
- 取消事件,這會阻止瀏覽器在某些平臺上顯示其自身的安裝 UI。
- 將
BeforeInstallPromptEvent物件分配給一個變數,以便以後使用。 - 顯示應用的安裝按鈕。
js
let installPrompt = null;
const installButton = document.querySelector("#install");
window.addEventListener("beforeinstallprompt", (event) => {
event.preventDefault();
installPrompt = event;
installButton.removeAttribute("hidden");
});
當點選時,應用的安裝按鈕
- 呼叫已儲存事件物件的
prompt()方法,以觸發安裝提示。 - 透過清除
installPrompt變數並再次隱藏自身來重置其狀態。
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", "");
});
瀏覽器相容性
載入中…