Ionic
1 基于ion-modal自定义alert弹出框
1.1 步骤
1.在全局css样式文件(global.scss)中定义弹出框css样式
.customModal {--background: var(--ion-overlay-background-color,var(--ion-color-step-100, #f9f9f9));--max-width: 270px;--backdrop-opacity: var(--ion-backdrop-opacity, 0.3);--min-width: 250px;--width: auto;--min-height: auto;--height: 50%;--max-height: 100%;}
2.创建组件
ionic g component components/customModal
3.调用方法
async presentModal() {const modal = await this.modalController.create({component: ModalPage,cssClass: 'customModal'});return await modal.present();}
1.2 参考案例
/lixian1998/ionic-custom-alert-modal.git
1.3 效果