我想从TS文件而不是通过全局SCSS文件调整模式的大小。
有一个简单的代码,您可以通过全局SCSS文件调整模式的大小。
HTML文件
<ion-content>
<ion-button expand="block" fill="outline" (click)="onModal()">
<ion-icon name="apps"></ion-icon>
</ion-button>
</ion-content>
TS文件:
export class HomePage {
constructor(private modalController: ModalController) {}
onModal() {
this.dynamicPreview('Dynamic Modal');
}
async dynamicPreview(info: any) {
const myModal = await this.modalController.create({
component: DynamicModalPage,
cssClass: 'dynamicModalCss',
componentProps: {
vInfo: info,
}
});
return await myModal.present();
}
}
Global SCSS文件:
.dynamicModalCss {
left: 0;
right: 0;
top: 0;
bottom: 0;
position: absolute;
contain: strict;
display: flex;
justify-content: center;
align-items: center;
.modal-wrapper {
width: 20rem;
height: 40rem;
}
}
我不知道该怎么做:(
感谢您的建议和帮助
自定义模态的唯一方法是使用CSS类。