elementui更改el-dialog關閉按鈕的圖標d的示例代碼
更新時間：2020年08月04日 09:34:03 作者：danbing2226
這篇文章主要介紹了elementui更改el-dialog關閉按鈕的圖標，本文通過實例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下
先給大家展示效果圖：
先上圖
<el-dialog title="對話框" :visible="true" @close="關閉事件()" @opened="打開事件()" class="想來點其他樣式">
主要是添加一下樣式
.el-dialog__headerbtn {
top: 8px !important;
background: url('https://你路徑資源的url圖片') left no-repeat;
background-size: cover;
}
.el-dialog__headerbtn i {
content: '修改下面的font-size可以改變圖片的大小';
font-size: 25px;
visibility: hidden;
}
PS：下面看下如何去除Element-UI中dialog右上角的關閉按鈕，具體內(nèi)容如下所示：
最近使用了Element-UI中的Dialog對話框，因為需求需要去掉右上角的關閉按鈕，如圖所示：
最后在網(wǎng)上找到了一個方法，直接上代碼
<el-dialog
title=""
:visible.sync="dialogVisible"
:showClose="showClo" //主要是這個屬性設為false即可
width="600px"
center>
<span>這是一段信息</span>
</el-dialog>
export default {
data() {
return {
showClo:false,
}
}
}
其中主要的就是showClose屬性，設置為false即可
方法來源：https://segmentfault.com/q/1010000012175677
總結
到此這篇關于elementui更改el-dialog關閉按鈕的圖標的文章就介紹到這了,更多相關elementui更改el-dialog關閉按鈕的圖標內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！
相關文章
這篇文章主要為大家詳細介紹了js實現(xiàn)年月日表單三級聯(lián)動，生日欄表單三級聯(lián)動，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-03-03
收集一些不多見的好用的自定義函數(shù)代碼 計算字符長度的js函數(shù) 去字符中前后的空格的js函數(shù) 圖片自適應大小函數(shù)代碼2008-09-09
location.href 在IE6中不跳轉的解決方法與推薦使用代碼
在js中，我們經(jīng)常使用location.href來實現(xiàn)頁面的跳轉，為了方便我們寫成函數(shù)。下面就分別說明下，下面的一些代碼的實現(xiàn)問題。2010-07-07
這篇文章主要介紹了JavaScript之clipboard用法詳解,本篇文章通過簡要的案例,講解了該項技術的了解與使用,以下就是詳細內(nèi)容,需要的朋友可以參考下2021-08-08
前段時間項目需要用到js樹，找了好多都不符合項目需求，后來發(fā)現(xiàn)了梅花雪樹和js框架，類似C#名稱空間的用法讓我眼前一亮，遂拿來主義，讀了幾遍代碼后就開工了（我是個急性子呵呵），完成了大部分，最近才找出來測試了下。2010-11-11
無間斷滾動marquee的詳細用法解析...2006-08-08
js前臺分頁顯示使用jquery1.8.7框架，本文目的主要給那些剛入行軟件開發(fā)，喜歡這也看看，程序需要有投入才有收獲感興趣的你可不要錯過了哈，希望可以幫助到你2013-03-03
【JS+CSS3】實現(xiàn)帶預覽圖幻燈片效果的示例代碼
下面小編就為大家?guī)硪黄綣S+CSS3】實現(xiàn)帶預覽圖幻燈片效果的示例代碼。小編覺得挺不錯的，現(xiàn)在分享給大家。給大家一個參考2016-03-03
本文分享了基于javascript實現(xiàn)的根據(jù)輸入郵箱號跳轉到相應登錄地址的具體實例代碼，需要的朋友一起來看下吧2016-12-12
這篇文章主要介紹了Javascript 閉包詳解及實例代碼的相關資料,閉包是一個特別抽象的概念，特別是ECMA規(guī)范給的定義，如果沒有實戰(zhàn)經(jīng)驗，很難從定義去理解它，需要的朋友可以參考下2016-11-11