<div @click="btnfc()">点击弹窗按钮</div>

<div  v-show="show">
<div @click="hiddenShow()">关闭</div>
</div>
new Vue({
el: '',
data: {
show:false,
},
mounted: function () { },
methods: {
//点击弹窗
btnfc:function () {
var that =this;
that.show =true;
},
        //点击关闭
hiddenShow:function () {
var that = this;
that.cshow = false;
},
}
});
}

样式自己写!!!!!!!!!!!!!!!!!!!!

最近在写vue 项目,一起学习一起进步,我会把我自己工作中vue的功能热更新哦!

vue 点击按钮弹窗,点击关闭按钮关闭弹窗。的更多相关文章

  1. JS---案例:点击按钮摇起来 & 星星闪动 (挺难看的)

    案例1:点击按钮摇起来 思路: 1. 2张图片,放进div里面,摇起来的本质是,此div按上下左右的位置和在一定的时间内发生移动 2. 所以用随机数的概念来实现位置的移动,用setInterval来实 ...

  2. Python+Selenium自动化-清空输入框、输入内容、点击按钮

    Python+Selenium自动化-清空输入框.输入内容.点击按钮   1.输入内容 send_keys('valve'):输入内容valve #定位输入框 input_box = browser. ...

  3. 1:时间戳转换成年月日函数,2:url截取参数方法,3:弹窗自定义方法 4:点击按钮加入购物车

    最近一直在使用vue.js来构建项目,先分享一下一些简单可复用的函数. 1:时间戳转换Date.prototype.format = function(fmt){ //author: yumeiqia ...

  4. vue 如何点击按钮返回上一页

    1,vue 如何点击按钮返回上一页呢? 这是vue挂载的范围html代码 <div @click="goOff()">返回</div> 下面是点击返回的方法 ...

  5. 解决关于 vue项目中 点击按钮路由多了个问号

    问题描述: 在vue项目开发过程中,点击按钮结果页面刷新了一遍 后来发现路径变成了 localhost:8080/?#/login 原因: 这里是 form 表单,点击了button 按钮,触发了他的 ...

  6. 纯Div+Css制作的漂亮点击按钮和关闭按钮

    纯Div+Css制作的漂亮点击按钮和关闭按钮,单击点击按钮也有效果.这些都不是图片.

  7. C#根据弹窗标题获取窗体句柄并模拟点击按钮(FindWindow,FindWindowEx,SendMessage)

    任务:将下面弹窗自动关闭 /// <summary> /// 找到窗口 /// </summary> /// <param name="lpClassName& ...

  8. vue踩坑之路--点击按钮改变div样式

    有时候,我们在做项目的时候,想通过某个按钮来改变某个div样式,那么可以通过以下代码实现: <!DOCTYPE html> <html> <head> <me ...

  9. 21、解决关于 vue项目中 点击按钮路由多了个问号

    在vue项目开发过程中,点击按钮结果页面刷新了一遍 后来发现路径变成了 localhost:8080/?#/login 原因: 这里是 form 表单,点击了button 按钮,触发了他的默认事件,就 ...

随机推荐

  1. 解决Excel打开UTF-8编码CSV文件乱码的问题

    打开 Excel,执行“数据”->“自文本”,选择 CSV 文件,出现文本导入向导,选择“分隔符号”,下一步,勾选“逗号”,去掉“ Tab 键”,下一步,完成,在“导入数据”对话框里,直接点确定 ...

  2. 【WIP】swift3的timer的用法

    创建: 2017/10/14   更新: 2017/10/14 标题加上[WIP],补充创建时间     回家再写

  3. 51nod1163【贪心】

    思路: 我们可以说: ①:价值大的不管时间早晚,都可以取,时间较晚的,本身就可以取,那么肯定是大的在前面取,但是在最前面那也是不对的,那么条件就是在规定的时间内,大的就是取了,因为他大,OK. ②:只 ...

  4. python string类型 bytes类型 bytearray类型

    一.python3对文本和二进制数据做了区分.文本是Unicode编码,str类型,用于显示.二进制类型是bytes类型,用于存储和传输.bytes是byte的序列,而str是unicode的序列. ...

  5. hdu 3038 How Many Answers Are Wrong【带权并查集】

    带权并查集,设f[x]为x的父亲,s[x]为sum[x]-sum[fx],路径压缩的时候记得改s #include<iostream> #include<cstdio> usi ...

  6. web前端图片预加载

    是什么? 浏览器会缓存静态资源(hmtl/css/img等).图片预加载就是让浏览器提前缓存图片,提升用户体验. 浏览器什么情况下会下载图片? 1,解析到html中img的src属性的时候 2,解析到 ...

  7. 组合数学1.4&3.10 By cellur925

    本文引用于清华大学出版社卢开澄.卢华明<组合数学第五版>. 今天我们稍微讨论下圆排列以及$n$对夫妻的问题. 1.4圆周排列 这个问题是:从$n$个人中取$r$个在圆周上,我们用$Q(n, ...

  8. Ubuntu解决中文乱码

    gsettings set org.gnome.gedit.preferences.encodings candidate-encodings "['GB18030', 'UTF-8', ' ...

  9. h5-35-ajax轮询实现推送效果

    data.txt { "number1":1200, } index.html <!DOCTYPE html> <html> <head> &l ...

  10. Web API DataContract DataMember Serializable简单解释

    首先看一下DataContract这个类契约: Web API/WCF 中类一旦标记了DataContract 属性,那么类中的属性只有被标记为DataMember属性才会被序列化,也就是说一个类的属 ...