浅析微信小程序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 相关文章推荐
一个无限级XML绑定跨框架菜单(For IE)
Jan 27 Javascript
jQuery 使用手册(七)
Sep 23 Javascript
jquery结合CSS使用validate实现漂亮的验证
Jan 29 Javascript
JavaScript中的Object对象学习教程
May 20 Javascript
JavaScript程序中的流程控制语句用法总结
May 23 Javascript
js 动态添加元素(div、li、img等)及设置属性的方法
Jul 19 Javascript
js仿微博动态栏功能
Feb 22 Javascript
详解为Bootstrap Modal添加拖拽的方法
Jan 05 Javascript
Angular5升级RxJS到5.5.3报错:EmptyError: no elements in sequence的解决方法
Apr 09 Javascript
使用webpack将ES6转化ES5的实现方法
Oct 13 Javascript
JavaScript数组reduce()方法的语法与实例解析
Jul 07 Javascript
Vue h函数的使用详解
Feb 18 Vue.js
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导出MySQL数据到Excel文件(fputcsv)
2011/07/03 PHP
PHP简洁函数(PHP简单明了函数语法)
2012/06/10 PHP
php获取远程图片体积大小的实例
2013/11/12 PHP
PHP的MVC模式实现原理分析(一相简单的MVC框架范例)
2014/04/29 PHP
PHP中define() 与 const定义常量的区别详解
2019/06/25 PHP
js实现的网页颜色代码表全集
2007/07/17 Javascript
jquery.combobox中文api和例子,修复了上面的小bug
2011/03/28 Javascript
原生js实现跨浏览器获取鼠标按键的值
2013/04/08 Javascript
js判断为空Null与字符串为空简写方法
2014/02/24 Javascript
JS实现可拖曳、可关闭的弹窗效果
2015/09/26 Javascript
jQuery实现连续动画效果实例分析
2015/10/09 Javascript
封装好的javascript前端分页插件pagination
2016/01/04 Javascript
JavaScript快速切换繁体中文和简体中文的方法及网站支持简繁体切换的绝招
2016/03/07 Javascript
Bootstrap学习笔记之css样式设计(1)
2016/06/07 Javascript
关于JSON与JSONP简单总结
2016/08/16 Javascript
BootStrap的table表头固定tbody滚动的实例代码
2016/08/24 Javascript
微信小程序 定义全局数据、函数复用、模版等详细介绍
2016/10/27 Javascript
Three.js实现浏览器变动时进行自适应的方法
2017/09/26 Javascript
Angular 利用路由跳转到指定页面的指定位置方法
2018/08/31 Javascript
浅析微信扫码登录原理(小结)
2018/10/29 Javascript
Python def函数的定义、使用及参数传递实现代码
2014/08/10 Python
基于python脚本实现软件的注册功能(机器码+注册码机制)
2016/10/09 Python
Python应用领域和就业形势分析总结
2019/05/14 Python
Python2和Python3中@abstractmethod使用方法
2020/02/04 Python
tensorflow实现残差网络方式(mnist数据集)
2020/05/26 Python
解决python调用自己文件函数/执行函数找不到包问题
2020/06/01 Python
基于python实现删除指定文件类型
2020/07/21 Python
Django crontab定时任务模块操作方法解析
2020/09/10 Python
html5实现多图片预览上传及点击可拖拽控件
2018/03/15 HTML / CSS
HTML5实现移动端复制功能
2018/04/19 HTML / CSS
巴西宠物店在线:Geração Pet
2017/05/31 全球购物
巴黎欧莱雅法国官网:L’Oreal Paris
2019/04/30 全球购物
终止合同协议书
2014/04/17 职场文书
高三霸气励志标语
2014/06/24 职场文书
西柏坡观后感
2015/06/08 职场文书
pyqt5打包成exe可执行文件的方法
2021/05/14 Python