Vue3实现弹窗拖拽(亲测有效)
取消遮罩层::modal="false"点击弹窗外其它地方,不关闭弹窗::close-on-click-modal="false"效果:(实际上没有这些灰色块块的,是录制工具的原因)
·
取消遮罩层::modal="false"
点击弹窗外其它地方,不关闭弹窗::close-on-click-modal="false"
<template>
<el-button type="text" @click="dialogVisible = true">点击出现弹窗</el-button>
<el-dialog v-model="dialogVisible" title="拖拽弹窗" width="30%" draggable :modal="false" :close-on-click-modal="false">
<p>君不见高堂明镜悲白发,朝如青丝暮成雪。</p>
<template #footer>
<el-button @click="dialogVisible = false">取消</el-button>
<el-button type="primary" @click="dialogVisible = false">确定</el-button>
</template>
</el-dialog>
</template>
<script lang="ts" setup>
import { ref } from 'vue'
const dialogVisible = ref(false)
</script>
效果:(实际上没有这些灰色块块的,是录制工具的原因)
更多推荐
已为社区贡献7条内容
所有评论(0)