vue 实现点击按钮弹出div 点击页面其他位置，隐藏div

1. 效果图2. 实现步骤给最外层的div加个点击事件 @click="screenRule=false"给点击的元素上面加上：@click.stop="screenRule=!screenRule" 或者 @click.stop="screenRule=true"3. 步骤截图初始化一个值，控制 div 显示和隐藏设置页面最外层（当用户点击页面内所有地方都会触发，把 div...

范特西是只猫

12073人浏览 · 2019-08-03 16:54:27

范特西是只猫 · 2019-08-03 16:54:27 发布

`1. 效果图`

在这里插入图片描述

`2. 实现步骤`

给最外层的div加个点击事件 @click="screenRule=false"
给点击的元素上面加上：@click.stop="screenRule=!screenRule" 或者 @click.stop="screenRule=true"

`3. 步骤截图`

初始化一个值，控制 div 显示和隐藏
设置页面最外层（当用户点击页面内所有地方都会触发，把 div 隐藏）
设置页面最外层（当用户点击该按钮时，是隐藏就显示，是显示就隐藏）

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^