LoginSignup
2
1

More than 3 years have passed since last update.

@masay421

Vuetify Dialog を背景固定でスクロールさせる方法（iOS Safari）

Posted at

課題

VuetifyのDialog（モーダル）を開いたとき、背景を固定させた状態でDialog内のカードをスクロールさせたい。

環境

Nuxt: 2.9.2
@nuxtjs/vuetify: 1.6.3
body-scroll-lock: 2.6.4

参考資料

【iOS対応】Vue.jsで背景固定のモーダルを作る
こちらの「Body Scroll Lockの使い方」を参考に考えました。

解決方法

VuetifyのDialogコンポーネント内の<v-card>にovarflow-y: hiddenを追加するのがポイント。具体的なコードはvuetifyのgithubにコメントを投稿してあります。

[Bug Report] IOS: when long dialog scroll, background should not scroll issue #3875

2
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
Sign upLogin
2
1