elementui 日期選擇器el-date-picker如何給指定日期添加圓點標注
更新時間：2024年07月02日 11:14:21 作者：weixin_45410246
這篇文章主要介紹了elementui 日期選擇器el-date-picker如何給指定日期添加圓點標注,本文通過實例代碼給大家介紹的非常詳細,需要的朋友可以參考下
elementui 日期選擇器el-date-picker給指定日期添加圓點標注
<el-date-picker
v-model="time"
type="date"
:clearable="false"
:picker-options="pickerOptions"
popper-class="picker-popper"
placeholder="選擇起始時間">
</el-date-picker>```對需要添加圓點的日期進行判斷
arrayTime為需要添加圓點的日期
cellClassName (date) {
if (this.arrayTime.includes(this.dateFormatter('YYYY-MM-DD')(null, null, date))) {
return 'badge'
}
},```添加樣式 在style標簽中加入scoped樣式會不生效 使用popper-class類名避免樣式沖突
.picker-popper .el-date-table__row .badge::after {
position: absolute;
content: "";
left: 17px;
bottom: -3px;
width: 8px;
height: 8px;
border-radius: 50%;
background-color: #8080ff;
}```到此這篇關于elementui 日期選擇器el-date-picker給指定日期添加圓點標注的文章就介紹到這了,更多相關elementui 日期選擇器el-date-picker內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！
相關文章
這篇文章主要介紹了最新vue-cli 2.9.1的webpack存在問題，小編覺得挺不錯的，現在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-12-12
本文主要介紹了vue實現在線預覽office文件，文中通過示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-10-10
關于element?ui的菜單default-active默認選中的問題
這篇文章主要介紹了關于element?ui的菜單default-active默認選中的問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-05-05
淺談vue自定義全局組件并通過全局方法 Vue.use() 使用該組件
本篇文章主要介紹了vue自定義全局組件并通過全局方法 Vue.use() 使用該組件，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-12-12
html頁面引入vue組件之http-vue-loader.js解讀
這篇文章主要介紹了html頁面引入vue組件之http-vue-loader.js解讀，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-04-04
如何將iconfont圖標引入到vant的Tabbar標簽欄里邊
這篇文章主要介紹了如何將iconfont圖標引入到vant的Tabbar標簽欄里邊，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-04-04
這篇文章主要介紹了解決vue頁面注入js修改input值問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-03-03
VUE訪問接口的時候,很可能出現跨域請求,從而被提供接口的服務器拒絕,下面這篇文章主要給大家介紹了關于Vue如何解決跨域問題的相關資料,需要的朋友可以參考下2022-02-02
這篇文章主要介紹了Vant的安裝和配合引入Vue.js項目里的方法步驟，小編覺得挺不錯的，現在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-12-12
本文主要介紹了Vue?項目的成功發(fā)布和部署的實現，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2022-05-05