PaymentRequest: shippingOption 屬性
已棄用:此特性不再推薦。雖然某些瀏覽器可能仍然支援它,但它可能已經從相關的網路標準中刪除,可能正在刪除過程中,或者可能僅為相容性目的而保留。請避免使用它,如果可能,請更新現有程式碼;請參閱本頁底部的相容性表格以指導您的決策。請注意,此特性可能隨時停止工作。
非標準:此特性未標準化。我們不建議在生產環境中使用非標準特性,因為它們瀏覽器支援有限,並且可能會更改或被移除。但是,在沒有標準選項的特定情況下,它們可以是合適的替代方案。
PaymentRequest 介面的只讀屬性 shippingOption 返回已選中的配送選項的 id、null(如果未選中任何配送選項)或使用者選擇的配送選項。當沒有提供“已選中”的配送選項時,它最初是 null。
僅當建構函式使用設定為 true 的 requestShipping 標誌呼叫時,此屬性才會被填充。如果 requestShipping 為 false(或缺失),則 shippingOption 返回 null,即使開發者提供了選中的配送選項。
值
物件或 null。
示例
在下面的示例中,會觸發 shippingaddresschange 和 shippingoptionchange 事件。每次呼叫 updateDetails() 都會執行,一次使用 Promise,另一次使用純 JS 物件。這演示了支付工作表的同步和非同步更新。
js
const request = new PaymentRequest(methodData, details, options);
// Async update to details
request.onshippingaddresschange = (ev) => {
ev.updateWith(checkShipping(request));
};
// Sync update to the total
request.onshippingoptionchange = (ev) => {
const shippingOption = shippingOptions.find(
(option) => option.id === request.id,
);
const newTotal = {
currency: "USD",
label: "Total due",
value: calculateNewTotal(shippingOption),
};
ev.updateWith({ ...details, total: newTotal });
};
async function checkShipping(request) {
try {
const json = request.shippingAddress.toJSON();
await ensureCanShipTo(json);
const { shippingOptions, total } = await calculateShipping(json);
return { ...details, shippingOptions, total };
} catch (err) {
return { ...details, error: `Sorry! we can't ship to your address.` };
}
}
瀏覽器相容性
載入中…