vue自定义弹窗dialog，vue 点击遮罩层功能区以外的地方关闭遮罩层

1.示例展示

2.代码

<template><div class="content"><div class="dialog-btn" @click="openPopup()">打开弹窗</div><!-- 预约弹窗 --><div class="dialog" v-if="isPopup" @click="closeMask($event)"><div class="dialog-content" ref="msk"><div class="content"><div class="head-title"><div class="dialog-title">预约书籍</div><div class="close" @click="closePopup()">x</div></div><!-- 预约详情 --><div class="detail">

vue自定义弹窗dialog，vue 点击遮罩层功能区以外的地方关闭遮罩层相关推荐

vue 点击遮罩层功能区以外的地方关闭遮罩层
点击红色框外的遮罩层区域关闭遮罩层方法一: 关键点:@click="close($event)" ref="msk" <div v-if="p ...
Vue自定义组件与Vue组件组件传值
一.Vue自定义组件组件是可复用的 Vue 实例,且带有一个名字.组件的出现是为了拆分 Vue 实例的代码量的,能够让我们以不同的组件,来划分不同的功能模块,将来我们需要什么样的功能,就可以去调用对 ...
vue自定义组件是.vue还是html,Vue自定义组件的四种方式示例详解
四种组件定义方式都存在以下共性(血泪史) 规则: 1.组件只能有一个根标签 2.记住两个词全局和局部 3.组件名称命名中'-小写字母'相当于大写英文字母(hello-com 相当于 helloCom) ...
vue自定义组件html,Vue自定义组件(简单实现一个自定义组件)
在用vue构建项目的过程中,我们有时会用到别人开发的组件如vue-router:使用他人组件的正常步骤如下: 1.命令行进行安装,执行install: 2.在vue项目中的入口文件main.js中,进 ...
jq点击按钮打开和关闭弹出层，点击除了当前按钮以外的地方关闭弹出层
1.html <a id="more" οnclick="moreFun()">更多</a> <ul id="moreL ...
点击弹出窗口外任意地方关闭弹出窗口
问:如何在点击弹出窗口外其他地方时关闭弹出窗口? 答:使用FlexMouseEvent'sMOUSE_DOWN_OUTSIDE事件.用户点击弹出窗口的外部时,会分发此事件.只需要在popUpWindo ...
vue 自定义弹窗组件
父组件 <template><div><p @click="onDelete">打开</p>< ...
vue自定义弹窗组件
在平时写页面的时候,一些页面总是需要到弹窗,可以将它写成组件的形式,考虑到有不一样的弹窗,可以按照下面的来写: 新建popup.vue, <template><div class=& ...
vue 自定义弹窗的使用
这个文章完全是写给自己用,方便自己后面开发,大部分借鉴他人的demo.参考地址:https://blog.csdn.net/qq_32442967/article/details/107343611 ...

vue自定义弹窗dialog，vue 点击遮罩层功能区以外的地方关闭遮罩层

vue自定义弹窗dialog，vue 点击遮罩层功能区以外的地方关闭遮罩层相关推荐

最新文章

热门文章