VUE是一種漸進式框架，旨在使應用程序開發更加容易。在VUE中，$modal封裝是一種實現模態對話框的方便方法。該封裝允許您輕松創建和管理模態對話框。

首先，我們需要安裝VUE。這可以通過運行以下命令來完成：

npm install vue

然后，我們可以使用下面的代碼創建一個簡單的模態對話框：

<template>
<div>
<button v-on:click="showModal = true">顯示模態對話框</button>
<modal v-if="showModal" v-on:close="showModal = false">
<h3 slot="header">這是一個標題</h3>
<p>這是模態對話框的內容。</p>
<button v-on:click="showModal = false">關閉模態對話框</button>
</modal>
</div>
</template>
<script>
// 導入modal組件
import Modal from './Modal.vue'
export default {
components: {
Modal
},
data () {
return {
showModal: false
}
}
}
</script>

我們首先在VUE模板中創建了一個按鈕，當我們單擊它時，會設置showModal變量為true。此變量用于判斷是否應該顯示模態對話框。如果它為true，則我們調用Modal組件來渲染對話框。

Modal組件包含一個header插槽和一個close事件。header插槽用于顯示對話框的標題，close事件用于關閉對話框。我們在插槽中添加了一個標題和內容。

在我們的VUE實例中，我們導入Modal組件并將其注冊為一個本地組件。然后，我們設置showModal變量初始化為false，以確保對話框一開始是隱藏的。

至此，我們已成功地創建了一個簡單的模態對話框。$modal封裝為我們提供了一種簡單且直觀的方法來創建這種對話框，并為我們處理了大量基礎工作。