浅析微信小程序modal弹窗关闭默认会执行cancel问题


Posted in Javascript onOctober 14, 2019

在我们使用小程序的modal组件时候,有的时候会碰到一个问题,那就是弹框的关闭,我们并没有选择取消或确定,而是点击弹框之外的部分,这个时候弹框会关闭,按理来说不会触发取消和确定的绑定事件,但是有的时候点击弹框之外的部分来关闭弹框会触发取消(cancel)绑定的事件,这是为什么呢?

如图是wxml页面

浅析微信小程序modal弹窗关闭默认会执行cancel问题

以下是页面对应的js内容

浅析微信小程序modal弹窗关闭默认会执行cancel问题

也就是说,就算我们不点击取消,点击弹框之外的部分,也会执行modelCancel方法。

后来发现,是header头的content-type在作怪,我们把header头里的content-type值改为application/json,再测试就没有问题了,关闭弹窗不再执行modelCancel。或者直接把header改为(去掉content-type,用默认的数据提交方式,也就是application/json)

var header = {
 'cookie': wx.getStorageSync("sessionid")
}

一个wx.request请求,必填项只有url,其他都是非必填。如图;

浅析微信小程序modal弹窗关闭默认会执行cancel问题

总结

以上所述是小编给大家介绍的浅析微信小程序modal弹窗关闭默认会执行cancel问题,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

Javascript 相关文章推荐
node.js中的url.format方法使用说明
Dec 10 Javascript
使用JavaScript脚本判断页面是否在微信中被打开
Mar 06 Javascript
用AngularJS来实现监察表单按钮的禁用效果
Nov 02 Javascript
把json格式的字符串转换成javascript对象或数组的方法总结
Nov 03 Javascript
js实现不提示直接关闭网页窗口
Mar 30 Javascript
JS限制输入框输入的实现代码
Jul 02 Javascript
JS通过位运算实现权限加解密
Aug 14 Javascript
在vue-cli的组件模板里使用font-awesome的两种方法
Sep 28 Javascript
关于JavaScript 数组你应该知道的事情(推荐)
Apr 10 Javascript
简单了解vue.js数组的常用操作
Jun 17 Javascript
详解小程序云开发攻略(解决最棘手的问题)
Sep 30 Javascript
详解一些适用于Node.js的命名约定
Dec 08 Javascript
vue实现百度语音合成的实例讲解
Oct 14 #Javascript
vue中进行微博分享的实例讲解
Oct 14 #Javascript
深入理解基于vue-cli的webpack打包优化实践及探索
Oct 14 #Javascript
Vue3.0 响应式系统源码逐行分析讲解
Oct 14 #Javascript
微信小程序 textarea 层级过高问题简单解决方案
Oct 14 #Javascript
vue的路由映射问题及解决方案
Oct 14 #Javascript
浅谈Vue为什么不能检测数组变动
Oct 14 #Javascript
You might like
php学习笔记之 函数声明
2011/06/09 PHP
php生成shtml类用法实例
2014/12/09 PHP
深入理解JavaScript系列(3) 全面解析Module模式
2012/01/15 Javascript
表格单元格交错着色实现思路及代码
2013/04/01 Javascript
js中window.open打开一个新的页面
2014/08/10 Javascript
详解AngularJS中的表格使用
2015/06/16 Javascript
jquery实现倒计时效果
2015/12/14 Javascript
vue实现单选和多选功能
2017/08/11 Javascript
浅谈webpack 构建性能优化策略小结
2018/06/13 Javascript
利用Bootstrap Multiselect实现下拉框多选功能
2019/04/08 Javascript
刷新页面后让控制台的js代码继续执行
2019/09/20 Javascript
微信小程序用canvas画图并分享
2020/03/09 Javascript
javascript设计模式 ? 观察者模式原理与用法实例分析
2020/04/22 Javascript
vue样式穿透 ::v-deep的具体使用
2020/06/04 Javascript
nginx部署多个vue项目的方法示例
2020/09/06 Javascript
Python中shutil模块的学习笔记教程
2017/04/04 Python
python中模块查找的原理与方法详解
2017/08/11 Python
基于python3 类的属性、方法、封装、继承实例讲解
2017/09/19 Python
python和flask中返回JSON数据的方法
2018/03/26 Python
pyqt5使用按钮进行界面的跳转方法
2019/06/19 Python
Django Rest framework解析器和渲染器详解
2019/07/25 Python
详解pytorch中squeeze()和unsqueeze()函数介绍
2020/09/03 Python
利用CSS的Sass预处理器(框架)来制作居中效果
2016/03/10 HTML / CSS
css3中单位px,em,rem,vh,vw,vmin,vmax的区别及浏览器支持情况
2016/12/06 HTML / CSS
html5视频常用API接口的实战示例
2020/03/20 HTML / CSS
学生励志演讲稿
2014/01/06 职场文书
参观考察邀请函范文
2014/01/29 职场文书
《守株待兔》教学反思
2014/03/01 职场文书
房屋买卖协议书范本
2014/09/27 职场文书
员工工作及收入证明
2014/10/28 职场文书
2015年教师党员承诺书
2015/04/27 职场文书
2015年实习生工作总结报告
2015/04/28 职场文书
学校勤俭节约倡议书
2015/04/29 职场文书
毕业论文答辩开场白
2015/05/27 职场文书
Python Pandas模块实现数据的统计分析的方法
2021/06/24 Python
Vue3.0中Ref与Reactive的区别示例详析
2021/07/07 Vue.js