用vue和element-ui写一个小弹窗,上面显示验证通过
时间: 2023-05-13 15:05:33 浏览: 160
好的,以下是使用 Vue 和 Element-UI 编写的小弹窗,上面显示验证通过的代码:
```
<template>
<el-dialog :visible.sync="dialogVisible">
<el-card>
<div slot="header" class="dialog-header">
<h3>验证通过</h3>
</div>
<div class="dialog-body">
<p>恭喜您,验证通过!</p>
</div>
<div class="dialog-footer">
<el-button type="primary" @click="dialogVisible = false">确定</el-button>
</div>
</el-card>
</el-dialog>
</template>
<script>
export default {
data() {
return {
dialogVisible: true
}
}
}
</script>
<style>
.dialog-header {
background-color: #409EFF;
color: #fff;
text-align: center;
padding: 10px;
}
.dialog-body {
text-align: center;
padding: 20px;
}
.dialog-footer {
text-align: center;
padding: 10px;
}
</style>
```
希望这个代码对你有帮助!
阅读全文