小程序常用功能总结
2017-09-11 13:10
267 查看
1.拨打电话 wxml:<view bindtap="call" data-phone="{{telephone}}"></view> call: function (e) { var phone = e.currentTarget.dataset.phone; if (!phone) return false; wx.makePhoneCall({ phoneNumber: phone }); }, 2.打开地图 openMap: function (e) { var _this = this var location = e.currentTarget.dataset.address; if (location == ''){ return; }else{ wx.request({ "url" : "https://restapi.amap.com/v3/geocode/geo?key='申请的key'&address=" + location , "success" : function(res){ if (result.data.count != "0") { var loc = result.data.geocodes[0].location.split(","); wx.openLocation({ longitude: parseFloat(loc[0]), latitude: parseFloat(loc[1]), name: location, complete: function () { } }); } } }); }, 3.修改radio的大小 .wx-radio-input{transform:scale(.8);} 4.tabBar在iphone6手机上显示成黑色的解决方法 app.json里面的tabBar里面的"backgroundColor": "#f6f6f6"(此处必须是16进制的) 5.微信小程序下拉刷新组件加载图片(三个小点)不显示的问题解决 原因:那三个点的默认颜色为白色,如果当前背景颜色为白色,那么就看不到那三个点了。 解决方法一:修改当前页面的背景色: page{ background:#e2e2e2; } 解决方法二:修改加载图标的默认颜色 { "navigationBarTitleText": "我的", "enablePullDownRefresh" :true, "backgroundTextStyle": "dark" } 6.下拉刷新 onPullDownRefresh: function () { this.getLists(); wx.stopPullDownRefresh() }, 7.tabBar配置 "tabBar": { "position": "bottom", "backgroundColor": "#f6f6f6", "selectedColor": "#009A8B", "color": "#c3c3c3", "borderStyle": "#E6E6E6", "list": [ { "pagePath": "pages/index/index", "iconPath": "pages/img/tabC1.png", "selectedIconPath": "pages/img/tabC_hover1.png", "text": " " }, { "pagePath": "pages/list/list", "iconPath": "pages/img/tabZ1.png", "selectedIconPath": "pages/img/tabZ_hover1.png", "text": " " }, { "pagePath": "pages/mine/mine", "iconPath": "pages/img/tabM1.png", "selectedIconPath": "pages/img/tabM_hover1.png", "text": "我的" } ] }, 8.图片预览 previewImage(e){ var id= that.data.id; var imgSrc = 'https://omdosaftr.qnssl.com/group_image_' + id wx.previewImage({ current: '', // 当前显示图片的http链接 urls: [imgSrc], // 需要预览的图片http链接列表 }) } 9.从一个小程序跳转到另外一个小程序 注意:只有同一公众号下的关联的小程序之间才可相互跳转 toAnotherApp(){ wx.navigateToMiniProgram({ appId: '要跳转到的小程序的appid', path: 'pages/detail/detail?Id='+ this.data.id, envVersion: 'develop', success(res) { // 打开成功 } }) } 10.动态设置当前页面的标题 wx.setNavigationBarTitle({ title: name+"详情", }) 11.剪贴板复制功能 copy: function(e){ var content = e.currentTarget.dataset.copytxt; wx.setClipboardData({ data: content, success: function (res) { wx.getClipboardData({ success: function (res) { wx.showToast({ title: '复制成功', icon: 'success', duration: 2000 }) } }) } }) },
相关文章推荐
- ASP.NET中常用功能代码总结——发送邮件篇
- ASP.NET中常用功能代码总结(7)——利用Jmail发送和接收邮件
- ASP.NET中常用功能代码总结——上传图片到数据库
- ASP.NET中常用功能代码总结(上传图片到数据库,从数据库中读取图片)
- yii2-GridView在开发中常用的功能及技巧总结
- ASP.NET中常用功能代码总结(保存图片到XML文件)
- ASP.NET中常用功能代码总结(2)——生成验证图片
- charles常用功能总结
- Go常用功能总结一阶段
- ASP.NET中常用功能代码总结(6)——XML文件操作篇
- chrome devtools 常用功能总结
- ASP.NET中常用功能代码总结(保存图片到XML文件)
- JavaScript 常用功能总结
- Burpsuite神器常用功能使用方法总结
- android 常用功能总结(1)
- C++中string类相关常用功能总结
- 大社区型网站的架构总结之如何标示用户在使用哪个功能程序篇(草稿)
- ASP.NET中常用功能代码总结(文件操作篇)
- python常用功能总结
- react-native 常用功能库几 4000 个人总结比较好的网站