element-ui踩坑指南


1、table表頭和表格線對不齊問題

解決辦法:

在index.html或者入口文件App.vue中添加樣式

body .el-table th.gutter{
    display: table-cell!important;
}

2、dialog對話框中使用form表單驗證,再次打開驗證依然存在問題

解決辦法:使用resetFields()方法或者clearValidate()方法重置表單或清除驗證

//open打開方法,在dialog打開時清除驗證
open () {
      this.showFlag = true
      this.$nextTick(() => {
        this.$refs.dynamicValidateForm.clearValidate()
      })
}

3、dialog關閉時同時使用message提示,message抖動問題

在頁面有滾動條的情況先打開dialog時,dialog會給頁面的<body></body>添加一個class類名和一個style樣式(padding-right:17px)。關閉時,body由於失去overflow屬性和padding-right屬性,message是居中的,所以會抖動一下

body {
    overflow-y: auto !important;
    padding-right: 0 !important;
}

4、el-input只允許輸入數字

雖然el-input有個屬性type可以設置為number,但是設置完成之后輸入框最右邊有上下箭頭調整數字大小的,這也是input自帶的,那么單純想設置數字的話用正則去過濾一下

<el-input type="text" onkeyup="value=value.replace(/[^\d]/g,'')" size="small" width="50" v-model="editRoleParam.roleID" placeholder="請輸入數字">

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM