项目要求：如图所示，当页面滚动到导航条到达搜索栏下方时固定，向上滚动到导航条位置时又恢复原样。 以下是代码展示： 1.wxml <scroll-view style="width:100%;height: 100%;" scroll-y="true" bindscroll="scrollTopFun"><view class="{{top>130 ? topnav : }}"><--这里写大于130，表示距离顶部130rpx时固定，可根据需要修改-->...</view> </scroll-view> 2.wxss .topnav{position: fixed;top: 85rpx;z-index:99;background: #...
平常在微信小程序开发的时候，因项目的需求，倒计时必不可少，下面主要讲解定时器在微信小程序中的使用。 这里要先声明一点的就是，该篇主要实现倒计时功能，而且实现是时长较短的倒计时，其他的优化什么的不作主要考虑。 如果实现简单的60s倒计时效果，我们可直接使用setInterval即可，但是在微信小程序中，我们需要用微信小程序的语法，这时就会遇到一个难题，那就是怎么关闭定时器的问题，下面给出实例。 WXML代码<view class=c...
开发小程序，封装有一个简单易用wx.request请求还是很必要的，可以省去大量的维护成本！闲话不多说，直接撸代码。 流程 创建http.js文件，封装wx.request创建api.js文件，统一管理所有接口在index.js中调用接口创建http.js文件，封装wx.request在utils中创建http.js文件，封装http，代码如下：module.exports = {http(url, method, params) {let token = token // 获取token，自行获取token和签名，token和签名表示每个接口都要发送...
微信小程序传值以及获取值方法，传值有两种方法，对应也有获取值得方法， 1、设置id的方法标识跳转后传递的参数值； 2、通过使用data - xxxx 的方法来标识要传递的值 微信小程序设置id的方法标识来传值 在要跳转的item处，设置一个id并给当前的id赋值上对应的key值，比如一部电影的id（后面带着id去下一个页面查询，详细信息）如：后我们在js的bindtap的响应事件中获取，并传递到下一个界面中； 获取到id传的值 通过e.currentTarge...
效果html代码 <form bindsubmit="formSubmit" bindreset="formReset"><view class="section section_gap"><view class="section__title">是否公开信息</view><switch name="isPub" /></view><view class="section"><view class="section__title">手机号</view><input name="phone" placeholder="手机号" /></view><view class="section"><view class="section__title">密码</view><input name="pwd" placeholder="密码" password/>...
效果 js let app = getApp(); Page({data: {img: "/images/1.jpg"},onLoad() {},scan() {wx.scanCode({success: (res) => {console.log("扫码结果");console.log(res);this.setData({img: res.result})},fail: (res) => {console.log(res);}})} }) html <view class="view"><image class="cover-9" src="{{img}}" bindtap="img"></image><button type="primary" bindtap="scan" id="scan">扫一扫</button> </view> css page{heig...
在本文 微信小程序--获取用户地理位置名称(无须用户授权) 之前需要先看看 微信小程序-获取用户session_key,openid,unionid - 后端为nodejs 代码封装是在上文添加的。 准备 1、在http://lbs.qq.com/网站申请key 2、在微信小程序后台把apis.map.qq.com添加进request合法域名 效果添加封装 /*** 发起网络请求* @param {string} url * @param {object} params * @return {Promise} */static request(url, params, method = "GET", type...
微信小程序-获取用户session_key,openid,unionid - 后端为nodejs8.0+ 步骤： 1、通过wx.login接口获取code既jscode，传递到后端； 2、后端请求 https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code 地址，就能获取到openid和unionid。 小程序接口promise化和封装 1、utils文件夹下创建wechat.js文件/*** Promise化小程序接口*/ class Wechat {/*** 登陆* @ret...
本文实例讲述了微信小程序实现的绘制table表格功能。分享给大家供大家参考，具体如下： 表格的绘制 js Page({ data:{ infeed:["", "1周", "2周", "3周", "总计"], endwise1: "游泳", tb1:"0", tb2:"0", tb3:"0", tb4:"0", endwise2: "跑步", tc1:"0", tc2:"0", tc3:"0", tc4:"0", endwise3: "健身", td1:"0", td2:"0", td3:"0", td4:"0", } })wxml <view class="tle"><view class="ae by-c"><block wx:for="{{infeed}}" wx:key="*t...
由于小程序页面退出时，定时器和长连接等不会自动清除断开，所以需要我们在生命周期函数中手动清除 但是定时器定义在函数中，我们无法在函数外清除，所以为了解决这个问题，我们需要把定时器定义在data中 比如：Loadingtime是一个定时器，在data中定义Loadingtime：。然后在time方法中使用在onUnload监听页面卸载生命周期函数中清除如此在退出该页面时，就可以清除该定时器了 以上所述是小编给大家介绍的小程序退出页面时清除定时器...
微信小程序官方是没有提供退出的API的，但是在navigator这个组件中，是有退出这个功能的：详情参考官方文档：navigator。 示例代码：<navigator open-type="exit" target="miniProgram">关闭小程序</navigator>不过这个功能最低支持版本时 2.1.0 ，如果一定要使用这个功能，那么最好在小程序管理后台中设置最低基础库版本不低于2.1.0，如果对小程序支持的最低基础库低于2.1.0，那么可以对小程序基础库版本进行判断，支持小程序退出...
公司要求用小程序重构已有的微信公众号，于是没接触过小程序的我。。。好的，直接进入主题。 如何在小程序里面退出小程序。 这个功能基本上都会用到，而文档里面没有找到如微信一样直接的api：WeixinJSBridge.call(closeWindow);于是我就各种上网搜，好的，结果告诉我小程序已经出了这个api，但未公开= =||| 那就是说 现在 是没有这个api的（掀桌！），查了又查，是有一个方法，就是利用现有的api自己做一个。是的，就是用这几个美...
获取当前时间 首先，在要获取时间的.js文件中加载util.js文件然后在onload方法中，调用util.js中的formatTime方法获取当前时间 //获取当前时间// 调用函数时，传入new Date()参数，返回值是日期和时间var TIME = util.formatTime(new Date());this.setData({time: TIME,}); 这样就获取到了当前时间，但是我们发现在util.js中并没有获取当前日期的方法。 没事，别慌！ 这个时候我们去看下util.js中获取当前时间的方法formatTime()，...
本文实例讲述了微信小程序实现的图片保存功能。分享给大家供大家参考，具体如下： 微信小程序保存图片分为两步： 1.下载文件资源到本地，客户端直接发起一个 HTTP GET 请求，返回文件的本地临时路径。 即：调用函数wx.downloadFile({}) 2.保存图片到系统相册。 即：调用函数wx.saveImageToPhotosAlbum({}) 具体代码如下： .wxml <button data-image={{图片路径}} bindtap="saveImage" >保存图片</button>.js saveImage: function (...
本文实例讲述了微信小程序实现的一键拨号功能。分享给大家供大家参考，具体如下： 1. 在.wxml文件中绑定拨号事件 <button type="default" bindtap="calling">拨打电话</button>2. 在.js文件中加入逻辑代码 calling: function () {wx.makePhoneCall({phoneNumber: ***************,success: function () {console.log("拨打电话成功！")},fail: function () {console.log("拨打电话失败！")}}) }3. 效果图关于wx.makePhoneCall更多详...