ionic-team / ionic-team/ionic-framework

Ionic 4 Modal not appearing with transparent background

オープン
#18,589 コメント 11 件 リアクション 1 件 担当者 0 名 GitHub で見る
package: core type: bug
主要言語
TypeScript
スター
52.7k
フォーク
13.3k
平均マージ
1日 15時間
マージ済み PR(30日)
51

説明

**Ionic version:**

[x] **4.x**

**I'm submitting a ...**

[ ] bug report
[ ] feature request

**Current behavior:**

My Modal is appearing with a solid background/Overlay

**Expected behavior:**

I want my modal to appear with a transparent background/overlay
**Steps to reproduce:**

**Related code:**

```
insert short code snippets here
modal.scss :
.main_view{
background: transparent;
}
.overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
opacity: .5;
background-color: #333;

}

modal.html:



and .ts to invoke modal in my app:

async confirm(){

const modal = await this.modalCtrl.create({
component: ModalPage,
// componentProps: {value : "test"},
});
await modal.present();
modal.onDidDismiss().then(res => {
console.log(JSON.stringify(res))
this.isModalDismiss = res.data.isDismiss;
console.log(this.isModalDismiss)
this.routeDriver();
});
}

```

**Other information:**

**Ionic info:**

```
insert the output from ionic info here
```

コントリビューションガイド

コントリビューションガイドを開く

調査の方向性

Start with the linked StackBlitz example and its pages/modal/modal.scss, then compare it with the provided modal.scss, modal.html, and confirm() code. Reproduce the modal in the affected app and identify why its background or overlay differs from the expected transparent appearance; done means the modal renders with the intended transparent background and overlay.

索引モデルが issue の本文から書いたものです。

評価

技術スタック
scss, typescript
領域
frontend, mobile-dev
issue の種類
バグ
難易度
3/5
見積もり時間
1〜2日
活発さ
停滞
明瞭さ
説明が足りない
初心者へのやさしさ
35/100

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。