000360截图20181129144024775.png (70.76 KB, 下载次数: 555)
下载附件 保存到相册
6 年前 上传
002360截图20181129144408223.png (40.1 KB, 下载次数: 587)
003360截图20181129144501976.png (33.96 KB, 下载次数: 577)
004360截图20181129144548303.png (37.33 KB, 下载次数: 582)
005360截图20181129144633096.png (30.76 KB, 下载次数: 565)
006360截图20181129144633096.png (36.06 KB, 下载次数: 575)
007360截图20181129144709422.png (21.96 KB, 下载次数: 622)
009360截图20181129144918247.png (33.01 KB, 下载次数: 611)
010360截图20181129144918247.png (41.08 KB, 下载次数: 577)
011360截图20181129145229751.png (35.31 KB, 下载次数: 545)
012360截图20181129145303599.png (35.55 KB, 下载次数: 544)
013360截图20181129145559337.png (32.69 KB, 下载次数: 598)
014360截图20181129145717527.png (36.79 KB, 下载次数: 617)
015360截图20181129145755272.png (33.8 KB, 下载次数: 577)
016360截图20181129145849335.png (41.61 KB, 下载次数: 554)
/** * @title 支付宝小程序自定义弹窗demo * @Create andy * @Timer 2018/11/27 23:50:45 GMT+0800 (中国标准时间) */ // 引入插件js import {wcPop} from '../../utils/component/wcPop/tpl.js'; Page({ /** * 页面的初始数据 */ data: { }, onLoad(query) { // 页面加载 console.info(`Page onLoad with query: ${JSON.stringify(query)}`); }, /** * --------- 支付宝小程序弹窗演示函数.Start --------- */ //msg提示 btnTap01: function(e) { wcPop({ anim: 'fadeIn', content: 'msg提示框测试(5s后窗口关闭)', shade: true, shadeClose: false, time: 5 }); }, //msg提示(黑色背景) btnTap02: function(e) { wcPop({ content: 'msg提示框测试(2s后窗口关闭)', shade: false, style: 'background: rgba(17,17,17,.7); color: #fff;', time: 2 }); }, //信息框 btnTap03: function(e) { var index = wcPop({ content: '信息框 (这里演示信息框功能效果,这里演示信息框功能效果,这里演示信息框功能效果)', shadeClose: true, anim: 'rollIn', xclose: true, btns: [ { text: '知道了', style: 'color: #999', onTap() { wcPop.close(index); console.log("知道了"); } } ] }); }, //询问框 btnTap04: function(e) { wcPop({ title: '温馨提示~~~', content: '警告,非法操作非法操作非法操作非法操作非法操作非法操作非法操作!!!', shadeClose: false, anim: 'shake', btns: [ { text: '取消', onTap() { console.log('您点击了取消!'); wcPop.close(); } }, { text: '确定', style: 'color:#108ee9;', onTap() { console.log('您点击了确定!'); } } ] }); }, //自定义多按钮 btnTap05: function(e) { wcPop({ title: '^-^支付是一种态度', content: '尊敬的用户,我们为您提供了“现金支付”和“微信支付两种方式”,请选择一种您的常用支付方式进行支付操作!!!', style: 'border-top:5px solid #108ee9;max-width:90%', //自定义弹窗样式 anim: 'fadeInUp', opacity: .85, btns: [ { text: '微信支付', style: 'color:#179b16;', onTap() { console.log('您选择了微信支付!'); } }, { text: '支付宝支付', style: 'color:#108ee9;', onTap() { console.log('您选择了支付宝支付!'); } }, { text: '取消', onTap() { console.log('您取消了支付请求!'); wcPop.close(); } } ] }); }, //底部对话框 btnTap06: function(e) { wcPop({ skin: 'footer', content: '确定删除该条数据吗?删除后可在7天之内恢复数据,超过7天后数据就无法恢复啦!', anim: 'footer', shadeClose: false, btns: [ { text: '恢复', style: 'color:#108ee9;', onTap() { console.log('您点击了恢复!'); } }, { text: '删除', style: 'color:#e63d23;', onTap() { console.log('您点击了删除!'); //删除回调提示 wcPop({ anim: 'fadeIn', content: '您点击了删除功能', shade: true, time: 3 }); } }, { text: '取消', onTap() { console.log('您点击了取消!'); wcPop.close(); } } ] }); }, })
来源:即时通讯网 - 即时通讯开发者社区!
轻量级开源移动端即时通讯框架。
快速入门 / 性能 / 指南 / 提问
轻量级Web端即时通讯框架。
详细介绍 / 精编源码 / 手册教程
移动端实时音视频框架。
详细介绍 / 性能测试 / 安装体验
基于MobileIMSDK的移动IM系统。
详细介绍 / 产品截图 / 安装体验
一套产品级Web端IM系统。
详细介绍 / 产品截图 / 演示视频
Copyright © 2014-2024 即时通讯网 - 即时通讯开发者社区 / 版本 V4.4
苏州网际时代信息科技有限公司 (苏ICP备16005070号-1)
Processed in 0.127935 second(s), 33 queries , Gzip On.