TypechoJoeTheme

轩宇网

搜索到 26 篇与 微信小程序开发 的结果
2020-03-24

微信小程序+php 授权登陆查看,完整代码

微信小程序+php 授权登陆查看,完整代码
先来看效果图实现流程:1、授权登陆按钮和正文信息放到了同一个页面,未授权的时候显示登陆按钮,已授权的时候隐藏登陆按钮,显示正文信息,当然也可以授权和正文分开成两个页面,在授权页面的onload里判断是否已授权,若已授权就直接跳转正文的页面。这里只说授权按钮和正文在同一页面的情况。2、在onload里先判断是否已授权,如果已授权,就隐藏授权登陆按钮,显示正文信息,如果没有授权,显示授权登陆按钮。3、前端使用button的open-type="getUserInfo"来操作,点击授权按钮之后,“e”中会携带userInfo,用户的基本信息(和使用wx.getUserInfo接口获取的数据一样,所以我是在"e"里面直接取的,没有调用wx.getUserInfo接口)4、使用wx.login接口获取登陆凭证code,使用code去后解密换取openid,传输code的时候带上第3步获取的用户信息一块发送给后台解密(也可以不携带,携带的目的是为了验证签名,这样安全一些,不验证也可以)5、后台解密使用的是“auth.code2Session”接口,解密用到的SDK下载地址“https://d...
2020年03月24日
3,844 阅读
0 评论
2020-03-05

微信小程序搜索功能(附:小程序前端+PHP后端)

微信小程序搜索功能(附:小程序前端+PHP后端)
这篇文章主要介绍了微信小程序搜索功能(附:小程序前端+PHP后端),小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧开发需求微信小程序已经是非常火了,而且学习也比较容易,但是对于初学者来说还是一件比较伤脑筋的事,接下来给大家分享一下小程序搜索的思路。流程1、表单(输入框、提交按钮、提交的name值)2、接收表单数据(js获取表单name=keyword的值)3、通过wx.request向服务器后端发起请求查询数据库4、返回JSON格式的数据给小程序,js解析渲染到小程序前端展示界面代码index.wxml<!-- 标题 --> <view class="title">小程序搜索</view> <!-- 搜索框view --> <view class="search_con"> <!-- 表单 --> <form bindsubmit="formSubmit"> <!-- 记得设置name值,这样JS...
2020年03月05日
4,126 阅读
0 评论
2020-03-05

微信小程序开发搜索功能实现(前端+后端+数据库)

微信小程序开发搜索功能实现(前端+后端+数据库)
这篇文章主要介绍了微信小程序开发搜索功能实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧界面比较丑,主要实现逻辑...超级简单的界面,表单,提交按钮,搜索结果展示区域...下面是index.wxml<!--index.wxml--> <form bindsubmit="formSubmit"> <!--提交按钮 --> <input type="text" name="id" placeholder='输入关键词' style='border:1px solid #ccc;height:30px;'/> <button formType="submit" class="btn">搜索</button> </form> <view>搜索结果</view> <view wx:for="{...
2020年03月05日
4,140 阅读
0 评论
2019-10-21

微信小程序选择图片和放大预览图片功能

微信小程序选择图片和放大预览图片功能
这篇文章主要介绍了微信小程序图片放大预览功能的实现方法,非常不错,具有参考借鉴价值,需要的朋友可以参考下视频中,老师也是看着官方文档,为学生们讲解,微信提供了系统的方法来选择图片.wx.chooseImage({})此方法是用来选择图片的方法,具体使用如下:data: { avatarUrl:null },首先在数据中定义接收数据的变量,然后调用方法选择图片,将图片显示出来。bindViewTap:function(){ var that = this; wx.chooseImage({ // 设置最多可以选择的图片张数,默认9,如果我们设置了多张,那么接收时//就不在是单个变量了, count: 1, sizeType: ['original', 'compressed'], // original 原图,compressed 压缩图,默认二者都有 sourceType: ['album', 'camera'], // album 从相册选图,camera 使用相机,默认二者都有 success: function(res){ /...
2019年10月21日
5,617 阅读
0 评论
2019-10-21

微信小程序实现左侧滑动导航栏

微信小程序实现左侧滑动导航栏
这篇文章主要为大家详细介绍了微信小程序实现左侧滑动导航栏,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下本文实例为大家分享了微信小程序实现左侧滑动导航栏的具体代码,供大家参考,具体内容如下左侧滑动导航栏如图wxml<!-- 左侧滚动栏 --> <view class='under_line'></view> <view style='float: left' class='left'> <scroll-view scroll-y scroll-with-animation scroll-left="{{scrollLength}}" class='scrollY' style='height: {{winHeight}}px'> <view class='all clear'> <block wx:key="lists" wx:for="{{lists}}"> <view bindtap='ju...
2019年10月21日
5,628 阅读
0 评论
2019-08-13

微信小程序实现slideUp、slideDown滑动效果及点击空白隐藏功能示例

微信小程序实现slideUp、slideDown滑动效果及点击空白隐藏功能示例
这篇文章主要介绍了微信小程序实现slideUp、slideDown滑动效果及点击空白隐藏功能,涉及微信小程序事件响应、页面元素属性动态操作实现滑动与蒙层功能相关技巧与注意事项,需要的朋友可以参考下本文实例讲述了微信小程序实现slideUp、slideDown滑动效果及点击空白隐藏功能。分享给大家供大家参考,具体如下:怎样实现jq中的slideUp或者slideDown这种动画效果呢,我的思路是用css3的transform: translateY() 属性,给需要动画的元素添加上一个动画class。先上效果图:1.蒙层的结构:<!-- 购物车蒙层 --> <view class='list-fix' wx:if="{{mengShow}}" bindtap='outbtn'> <!--mengShow是蒙层是否显示的标志,然后蒙层绑定outbtn的点击事件--> <view class='in-list {{aniStyle?"slideup":"slidedown"...
2019年08月13日
6,267 阅读
0 评论
2019-07-15

微信小程序开发技巧汇总

微信小程序开发技巧汇总
这篇文章主要介绍了微信小程序开发技巧汇总,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下1.全局变量的使用每个小程序都需要在 app.js 中调用 App 方法注册小程序示例,绑定生命周期回调函数、错误监听和页面不存在监听函数等。详细的参数含义和使用请参考 App 参考文档 。整个小程序只有一个 App 实例,是全部页面共享的。开发者可以通过 getApp 方法获取到全局唯一的 App 示例,获取App上的数据或调用开发者注册在 App 上的函数。我们在做小程序的时候往往需要大量的请求,而请求的域名也都是相同的,我们可以把域名储存到全局变量中,这样会方便后面请求域名的修改。(user_id、unionid、user_info之类经常用到的都可以放在全局变量中)//app.js App({ globalData: { user_id: null, unionid:null, url:"https://xxx.com/index.php/Home/Mobile/", //请求的域名 user_...
2019年07月15日
5,807 阅读
0 评论
2019-06-20

微信小程序实现订单倒计时

微信小程序实现订单倒计时
这篇文章主要为大家详细介绍了微信小程序实现订单倒计时,具有一定的参考价值,感兴趣的小伙伴们可以参考一下本文实例为大家分享了微信小程序实现订单倒计时的具体代码,供大家参考,具体内容如下之前在做一个有拼团功能项目的时候遇到过倒计时的问题,由于当时技术不熟在这方面耽搁了好些时间,所以这里整理出来希望能为后来人提供些许启发。1.实现思路求出发起拼团时间与拼团结束时间的时间差再将时间差格式化得到我们想要的格式如:时间每秒递减使用了 setTimeout(this.setTimeCount,1000);这个函数,让这个函数每隔一秒执行一次。效果图:2.实现中的难点若是要实现单个倒计时如60s发送验证码倒不是很难,难的是多条倒计时。不同的订单下单时间是不一样的时间差time也就不一样,所以当初在这卡了很久,后来想通一切才觉得原来如此。实现方法1:是后台计算出时间前端直接获取时间差,当时为了不影响项目进度我们用的就是这个方法,真是苦了那个些后台的兄弟还得迁就我这个菜鸟。获取这个时间差time后我们就可以将它处理后放入数组循环。这样做的好处是前端不用将time作为一个属性添加到原数组中。index...
2019年06月20日
4,435 阅读
0 评论
2019-06-10

微信小程序发布新版本时自动提示用户更新的方法

微信小程序发布新版本时自动提示用户更新的方法
这篇文章主要介绍了微信小程序发布新版本时自动提示用户更新的方法,文中通过示例代码介绍的非常详细,对大家学习或者使用小程序具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧如图,当小程序发布新的版本后,用户如果之前访问过该小程序,通过已打开的小程序进入(未手动删除),则会弹出这个提示,提醒用户更新新的版本。用户点击确定就可以自动重启更新,点击取消则关闭弹窗,不再更新。官方给的示例代码:const updateManager = wx.getUpdateManager() updateManager.onCheckForUpdate(function (res) { // 请求完新版本信息的回调 console.log(res.hasUpdate) }) updateManager.onUpdateReady(function () { wx.showModal({ title: '更新提示', content: '新版本已经准备好,是否重启应用?', success(res) { if (res.confirm) { // 新的版本已经下载...
2019年06月10日
4,630 阅读
0 评论
2019-05-10

微信小程序实现打卡日历功能

微信小程序实现打卡日历功能
这篇文章主要介为大家详细绍了微信小程序实现打卡日历功能,具有一定的参考价值,感兴趣的小伙伴们可以参考一下生活中有各种可以打卡的app,例如背单词打卡什么的,本人觉得很有意思,于是本人在大二时做了一款诚信状打卡的微信小程序,这里讲述一下编写的过程。先说一下开发环境:用的是微信web开发工具开发的,后台采用了Bmob后台,比较方便。先展示一下成果:话不多说,直接上代码,里面也有挺多的注释,以防自己忘记,当然各位如果直接复制过去肯定不能有当前的效果,注意后台数据的交互,不过做一个界面还是没有问题的。Calendar.wxml 页面文件 页面上显示出来的东西,布局上主要是一个年月栏、上一个月和下一个月的按钮;然后是星期栏,就是日一二三四五六,然后就是每个月的日期,注意每个月的前面可能有空的地方。这里面用wx:if标签来区分当前日期有无打卡的情况。<!--pages/Calendar/Calendar.wxml--> <!-- 打卡日历页面 --> <view class='all'> <view class="bar">...
2019年05月10日
8,037 阅读
0 评论