Fetch the repository succeeded.
对 element-plus
的 Dialog
组件进行封装。
Dialog 组件位于 src/components/Dialog 内
<script setup lang="ts">
import { Dialog } from '@/components/Dialog'
import { ElButton } from 'element-plus'
import { ref } from 'vue'
const dialogVisible = ref(false)
</script>
<template>
<ElButton type="primary" @click="dialogVisible = !dialogVisible">
open
</ElButton>
<Dialog v-model="dialogVisible" title="dialog">
<div v-for="v in 10000" :key="v">{{ v }}</div>
<template #footer>
<el-button @click="dialogVisible = false">close</el-button>
</template>
</Dialog>
</template>
除以下参数外,还支持 element-plus
的 Dialog
所有属性,详见
属性 | 说明 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
modelValue | 是否显示弹窗,支持v-model | boolean |
- | false |
fullscreen | 是否显示全屏按钮 | boolean |
- | true |
title | 弹窗标题 | string |
- | Dialog |
maxHeight | 弹窗内容最大高度 | string /number |
- | 500px |
插槽名 | 说明 | 子标签 |
---|---|---|
- | 弹窗内容 | - |
title | 弹窗标题内容 | - |
footer | 弹窗底部内容 | - |
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。