Vue中的iframe的使用非常方便，但是當我們需要把它居中顯示的時候，可能會出現一些問題。如果按照普通div居中處理的方式，往往會出現偏差。下面我們來介紹一種簡單的方法來實現iframe的居中顯示。

首先，我們需要在vue組件中定義一個容器div，將iframe放在其中。代碼如下：

<template>
<div class="iframe-container">
<iframe src="https://www.example.com"></iframe>
</div>
</template>

接著，在CSS中對這個容器進行樣式設置，讓它居中顯示。代碼如下：

.iframe-container {
display: flex;
justify-content: center;
align-items: center;
height: 100%;
}
iframe {
width: 100%;
height: 100%;
border: none;
}

這里我們使用了flex布局，讓容器水平和垂直居中。同時，我們將iframe的寬度和容器一致，并設置為100%。這些樣式設置可以讓iframe完美地居中。

通過以上簡單的設置，我們就可以讓vue中的iframe水平和垂直居中地顯示了。這種方法簡單實用，同時也很常用，可以大幅度提升網站的視覺體驗。