Open3

Vueでモーダルを実装する

非常によく使うUIの割にプロジェクトごとに再実装することになるなど無駄を感じたので一度まとめたい

共通部分に必要な機能

  • 開閉状態変数の隠蔽
  • モーダルの要素がbody要素内の下部にレンダリングされる
  • 複数のモーダルを同時に表示できる
  • 背景のオーバーレイ(backdrop?)部分の表示、クリック時にモーダルを閉じる
  • 表示・非表示時のtransition
  • ESC押下時に最後に表示したモーダルを閉じる
  • モーダルが閉じる前に状態に応じて確認ダイアログを表示できる
作成者以外のコメントは許可されていません