我在 Ionic 中有模態，它運行良好，但我無法設定它的樣式，它總是在移動設備上顯示全屏。如果你能指導我定制它，我將不勝感激。謝謝！
ts:
const modal = await this.modalCtrl.create({
component: ModalInfoPage,
cssClass: 'my-modal-info',
.................
global.scss:
.my-modal-info .modal-wrapper {
background-color: rgb(65, 153, 22);
height: 60%;
top: 20%;
position: absolute;
display: block;
}
Ionic CLI : 6.10.0 (C:\Users\UUU\AppData\Roaming\npm\node_modules\@ionic\cli)
Ionic Framework : @ionic/angular 6.0.2
@angular/cli : 13.0.4
Cordova:
Cordova CLI : 9.0.0 ([email protected])
Cordova Platforms : android 8.1.0
uj5u.com熱心網友回復：
全域.scss
ion-modal#ride-time {
--background: rgba(0, 0, 0, 0.2);
&::part(content) {
backdrop-filter: blur(6px);
width: 100%;
height: 100%;
}
app-time-picker {
background: transparent;
padding-top: 50%;
padding-block-start: 50%;
padding-left: 10%;
padding-right: 10%;
}
}
ts：
async openTime(componentProps) {
const options: ModalOptions = {
id: 'ride-time',
keyboardClose: true,
component: TimePickerPage,
componentProps: componentProps,
};
const modal = await this.modalCtrl.create(options);
return modal;
}
瞄準的方式已經改變，現在你需要使用陰影部分來實作你想要的..
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/417722.html
標籤：