在這方面需要幫助，如何在 ionic UIActionSheet 中添加多行？我嘗試添加 '/n' 但它不能在 detail.ts 檔案中作業。
<ion-button expand="full" shape="round" class="ion-margin" *ngIf="facility.bookable" (click)="showSlots()">
Booking Now
</ion-button>
public async showSlots() {
const buttons = this.facility.slot.map((slot) => {
if (slot.availability > 0) {
let name = slot.name;
if (slot.price !== '0.00') {
name = `${name} - RM${slot.price}` '\n' `${slot.start_time} - ${slot.end_time}`;
}
return {
text: name,
handler: () => {
this.bookingSlot(slot);
}
};
}
});
const actionSheet = await this.actionSheetController.create({
header: 'Slots',
buttons
});
await actionSheet.present();
}
這是當前 ui 外觀的示例 在此處輸入影像描述
這是我想嘗試存檔的 ui 在此處輸入影像描述
uj5u.com熱心網友回復：
您將無法從我在源中看到的內容執行此操作。從下面突出顯示的源代碼中可以看出，ActionSheet Button 接受字串型別。
export interface ActionSheetButton {
text?: string;
role?: 'cancel' | 'destructive' | 'selected' | string;
icon?: string;
cssClass?: string | string[];
handler?: () => boolean | void | Promise<boolean | void>;
}
您是否考慮過嘗試與模態組件類似的東西？這將支持您的用戶體驗需求。
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/312550.html