Vueでダイアログを動的に生成してマウントするサンプル作ってみた - Qiita

課題 Vueでサービスを作っててダイアログやモーダルを表示したいときに、公式だとdataにフラグを持たせてClickイベントでtrue/falseを切り替えるようにしていた。ただ、これだと画面内で表示したいダイアログが増えるほどにdataのフラグも増えるし、テンプレートの中に各フラグと紐づいたdialogタグを量産することになって、めちゃくちゃ見にくいし何より格好悪い。 なので、showDialog()的な感じでメソッド呼び出しでダイアログを表示させたい やったこと renoinn/vue-dialog-sample というわけで、DialogHelper.showDialog()とすることでダイアログを表示させるサンプルを作ってみた。 解説 キモになるのは以下の点 methods: { attach () { if (!this.$parent) { this.$mount(); doc