element-ui this.$confirm 自定义样式
element
A Vue.js 2.0 UI Toolkit for Web
项目地址:https://gitcode.com/gh_mirrors/eleme/element
·
this.$confirm('删除后无法恢复,你还要继续吗?', '删除用户信息', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
customClass: 'confirm'
}).then(function(res) {
console.log(res)
}).catch(function(err) {
console.log(err)
})
问题:在js里定义了一个$confirm 修改弹框样式,没有效果,主要是因为这个div不是vue的组件 不具备组件的一些特性 所以不生效也是必然
解决问题:scoped不生效,那么只能将样式放全局,在当前组件加上一段不带scoped的style,或者放到全局样式表中
<style>
.confirm{
height: 160px;
}
.confirm .el-message-box__header{
border-bottom: 1px solid #CCCCCC;
}
.confirm .el-message-box__container{
text-align: center;
}
.confirm .el-message-box__status.el-icon-warning{
left: 70px;
}
.confirm.el-message-box__title{
font-size: 16px;
}
.confirm .el-message-box__message p {
color: #F92D2D;
margin-top: 5px;
}
.confirm .el-message-box__btns{
text-align: center;
margin-top: 10px;
}
</style>
scoped会影响局部样式修改,当样式无法修改,首先要检查是否是scoped对其干扰了。
A Vue.js 2.0 UI Toolkit for Web
最近提交(Master分支:2 个月前 )
c345bb45
1 年前
a07f3a59
* Update transition.md
* Update table.md
* Update transition.md
* Update table.md
* Update transition.md
* Update table.md
* Update table.md
* Update transition.md
* Update popover.md 1 年前
AtomGit 是由开放原子开源基金会联合 CSDN 等生态伙伴共同推出的新一代开源与人工智能协作平台。平台坚持“开放、中立、公益”的理念,把代码托管、模型共享、数据集托管、智能体开发体验和算力服务整合在一起,为开发者提供从开发、训练到部署的一站式体验。
更多推荐



所有评论(0)