模態框（Modal）是指當用戶與一個系統交互時，該界面會以彈窗的形式展現出來，用戶必須要進行操作后才能繼續使用系統。在Vue中，我們可以使用一個強大的插件-Element-UI來實現模態框的顯示。

在使用Element-UI之前，我們需要先安裝Element-UI。具體安裝方法可以在Element-UI官方網站(http://element-cn.eleme.io/)上查找到。

我們首先需要在Vue組件中引入Element-UI中的Dialog組件。在Vue中，我們可以在組件中通過import關鍵字進行引入，如下：

import { Dialog } from 'element-ui';

引入Dialog組件之后，我們就可以在Vue組件中使用Dialog來顯示模態框。為了方便使用，我們可以在Vue組件中定義一個data：如下所示：

data() {
return {
dialogVisible: false
};
}

在這里，我們通過定義dialogVisible變量來表示當前模態框是否顯示，在初始情況下，dialogVisible初始值設為false。

接下來，我們在Vue組件中定義一個按鈕，當用戶點擊該按鈕時，就會觸發顯示模態框的操作。如下所示：

點擊顯示模態框

在這里，我們通過@click方法為按鈕添加了一個點擊事件，當用戶點擊該按鈕時，會觸發一個dialogVisible變量的賦值操作，將其設為true。這就表示用戶要求顯示模態框。

在Vue組件中，我們需要聲明Dialog組件。要聲明Dialog組件，我們可以使用Vue的template模板語法，如下所示：

這里是模態框的內容

在這里，我們通過標簽來聲明一個Dialog組件。注意，我們使用了:visible.sync="dialogVisible"來綁定模態框的顯示狀態。這意味著，當dialogVisible改變時，模態框的顯示狀態會同步變化。

在Dialog組件中，我們可以添加各種元素。在這里，我們添加了一個< span>元素作為模態框的內容顯示。你可以添加任何你需要的內容。

最后，讓我們看看如何在Vue組件中編寫事件處理程序。假設我們有一個確定按鈕來關閉模態框，當用戶點擊該按鈕時，我們需要將模態框隱藏。在Vue組件中，我們可以這樣寫：

關閉模態框

submit() {
this.dialogVisible = false;
}

在這里，我們為按鈕添加了一個點擊事件。當用戶點擊該按鈕時，會觸發一個submit函數。在submit函數中，我們將dialogVisible變量設為false，這意味著我們隱藏了模態框。

這就是使用Element-UI在Vue中顯示模態框的全部內容。雖然本文只是簡要介紹如何顯示模態框，但是你可以在Element-UI官方文檔中找到更多有關于模態框的細節和其他組件的詳細信息。希望這篇文章能夠對你有所幫助。