分类归档

小程序

FWQ
小程序
聊聊小程序中怎么同步或异步操作本地存储
本篇文章带大家了解一下微信小程序中的同步异步存储,介绍一下同步操作本地存储和异步操作本地存储的方法,希望对大家有所帮助! 一.同步操作本地存储 除非必要时候,尽量使用同步方法,特别是新手,建议使用同步方法,除非同步方法解决不了问题考虑使用异步方法。【相关学习推荐:】 wx.setStorageSync同步存: wx.setStorageSync('key', 'value') 登录后复制 效果可以在微信小程序调试器中看如下 wx.getStorageSync同步获取: wx.getStorageSync('key') console.log(wx.getStorageSync('key'))//value 登录后复制 wx.getStorageInfoSync()当前 storage 中的信息 const res = wx.getStorageInfoSync() console.log(res.keys)//["logs", "key"] //res.keys当前 storage 中所有的 key console.log(res.currentSize)//1 //res.currentSize当前占用的空间大小, 单位 KB console.log(res.limitSize)//10240 //res.limitSize限制的空间大小,单位 KB 登录后复制 wx.removeStorageSync同步移除某一个: wx.removeStorageSync('key') 登录后复制 移除之后叫做key的storage就会消失不见 wx.clearStorageSync同步清除所有: wx.clearStorageSync()…
2024-11-25 阅读全文 →
FWQ
小程序
jQuery实现鼠标绑定事件图片放大功能
这次给大家带来jQuery实现鼠标绑定事件图片放大功能,jQuery实现鼠标绑定事件图片放大功能的有哪些,下面就是实战案例,一起来看一下。 <!doctype html> <html> <head> <meta charset="utf-8"> <title>jQuery图片变换</title> </head> <style type="text/css"> .show{width:330px; height:auto; margin:50px auto; background:#eee} .item{background:#fff; width:300px; height:auto; float:left; margin:15px;} p{ padding:15px; color:#ff6600} .big-photo img{ width:300px; height:300px;…
2024-11-25 阅读全文 →
FWQ
小程序
微信小程序页面间跳转如何监听事件?
在微信小程序的开发过程中,我们可定会遇到页面间相互跳转的需求,那么如何监听页面跳转之间的事件呢?我们在之前的一篇文章:艺龙微信小程序框架组件研究(附源码)为例,来看一看小程序在页面之间相互跳转时的事件机制。 我们知道小程序提供打开新页面、页面重定向、页面返回、tabBar切换四种改变视图的机制,托管了页面的生命周期,并为应用提供了相应的生命周期事件,方便应用各阶段的业务处理,但页面之间相互跳转并没有相应的事件机制,例如—— 1、A页面打开二级页B,B页面做了一些操作,要通知A页面做相应的处理。 2、从B页面携带一些数据,返回到A页面 以上两种场景很常见,归结为页面间如何方便的进行交互,当然我们可以通过页面跳转传参或全局数据对象来达到目的,但是使用上有些束缚(转换参数或维护全局对象)! 所以在elong小程序项目中采用事件机制解决这一问题。我们重写了navigateToAPI,A页面调用该接口进行页面跳转后,方法返回给A页面一个事件对象 event,该对象可以注册自定义事件,目标页面(B页面)可以按照业务需求触发事件响应,同时将相关数据作为参数传递到监听处callback。 A页面 B页面 API Event 部分代码如下: [AppleScript]      Page({         data: {             userInfo: {}         },         navigateToHttp: function () {             var event = api.Navigate.go({                 url: '../http/index',                 params: {                     name: 'billy'                 }             });             event.on("listok", function (params) {                 console.log(params)             });         },…
2024-11-25 阅读全文 →
FWQ
小程序
关于微信支付小程序v3【附PHP完整后端代码】
微信支付 小程序 (v3)- php 完整后端代码 踩坑太多,不多说,直接上完整后端代码 <?php header('Content-type:text/html; Charset=utf-8'); ini_set('date.timezone','Asia/Shanghai'); $data_s = file_get_contents('php://input'); $data_s = json_decode($data_s,true); //统一下单 function wechartAddOrder($name,$ordernumber,$money,$openid,$timeStamp,$noncestr){ $url = "https://api.mch.weixin.qq.com/v3/pay/transactions/jsapi"; $urlarr = parse_url($url); $appid = '小程序APPID';//appID…
2024-11-25 阅读全文 →
FWQ
小程序
详解Android高仿微信聊天界面实例
微信聊天现在非常火,是因其界面漂亮吗,哈哈,也许吧。微信每条消息都带有一个气泡,非常迷人,看起来感觉实现起来非常难,其实并不难。下面小编给大家分享实现代码 先给大家展示下实现效果图: OK,下面我们来看一下整个小项目的主体结构: 下面是Activity的代码: package com.way.demo; import java.text.SimpleDateFormat; import java.util.ArrayList; import java.util.Date; import java.util.List; import android.app.Activity; import android.os.Bundle; import android.view.View; import android.view.View.OnClickListener; import android.widget.Button; import android.widget.EditText; import android.widget.ListView;…
2024-11-25 阅读全文 →
FWQ
小程序
小程序使用函数节流解决页面多次跳转问题
本篇文章给大家介绍一下小程序使用函数节流解决页面多次跳转问题。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。 在使用小程序的时候会出现这样一种情况:当网络条件差或卡顿的情况下,使用者会认为点击无效而进行多次点击,最后出现多次跳转页面的情况,这个问题可以通过JS中的函数节流和函数防抖找到解决方法。 根据官方文档介绍,函数节流就是规定一个单位时间,在这个单位时间内,只能有一次触发事件的回调函数执行,如果在同一个单位时间内某事件被触发多次,只有一次能生效。因此修改.js文件如下: function throttle(fn, gapTime) { if (gapTime == null|| gapTime == undefined) { gapTime = 1500 } let _lastTime = nullreturn function () { let _nowTime = +new Date() if (_nowTime -_lastTime &gt; gapTime || !_lastTime) { fn() _lastTime =_nowTime } } } module.exports = { throttle: throttle } /pages/throttle/throttle.wxml: tap /pages/throttle/throttle.js const util = require('../../utils/util.js') Page({ data: { text: 'tomfriwel' }, onLoad: function (options) { },…
2024-11-25 阅读全文 →
FWQ
小程序
小程序执行流程分析
导语: 微信小程序,小程序的一种,英文名Wechat Mini Program,是一种不需要下载安装即可使用的应用,它实现了应用“触手可及”的梦想,用户扫一扫或搜一下即可打开应用。 全面开放申请后,主体类型为企业、政府、媒体、其他组织或个人的开发者,均可申请注册小程序。微信小程序、微信订阅号、微信服务号、微信企业号是并行的体系。 我们这边最近一直在做基础服务,这一切都是为了完善技术体系,这里对于前端来说便是我们需要做一个Hybrid体系,如果做App,React Native也是不错的选择,但是一定要有完善的分层: ① 底层框架解决开发效率,将复杂的部分做成一个黑匣子,给页面开发展示的只是固定的三板斧,固定的模式下开发即可 ② 工程部门为业务开发者封装最小化开发环境,最优为浏览器,确实不行便为其提供一个类似浏览器的调试环境 如此一来,业务便能快速迭代,因为业务开发者写的代码大同小异,所以底层框架配合工程团队(一般是同一个团队),便可以在底层做掉很多效率性能问题。 稍微大点的公司,稍微宽裕的团队,还会同步做很多后续的性能监控、错误日志工作,如此形成一套文档->开发->调试->构建->发布->监控、分析 为一套完善的技术体系 如果形成了这么一套体系,那么后续就算是内部框架更改、技术革新,也是在这个体系上改造,但很可惜,很多团队只会在这个路径上做一部分,后面由于种种原因不在深入,有可能是感觉没价值,而最恐怖的行为是,自己的体系没形成就贸然的换基础框架,戒之慎之啊! 从第三方应用接入来说,微信应该是做的最好的,百度这边有直达号等类似的产品,但是其体系化感觉还是有待提高的,阿里应该也有类似的技术产品诞生,从我们这层来说,都没有太多知晓,所以要么是运营的不好要么是做的不好。 而从小程序诞生以来,我这边便一直在关注,至今整个小程序体系已经十分完备了,腾讯小程序和腾讯云深度整合了,如果使用内测的开发者工具,全免费,纯js就搞定小程序前后端,不用服务器、存储、cdn、服务代码,都是免费,开发完后端不用自己运维,大杀器的节奏,我有时候在想,腾讯的技术实力真的是强啊! 小程序的结构追溯 小程序的开发文档还是比较完善的,依旧是 账号申请->demo 流程,等熟悉后便可以走代码上架等流程了,前端代码用工具构建后上传,后台服务自己维护,配置地址映射,我们这里仅关注开发流程,所有使用其测试账号即可。 1 appid wx0c387cc8c19bdf78 2 appsecret acd6c02e2fdca183416df1269d2e3fb9 登录后复制 经过一年多的发展,小程序形成的文档已经比较完善了,我们可以从文档和demo对小程序做出大概的判断: 这里就是小程序给业务人员可以看到的代码了,我们从这个代码以及运行,基本可以将小程序的梗概猜测一番,这里首先看看其全局控制器APP: //app.js App({…
2024-11-25 阅读全文 →
FWQ
小程序
微信小程序开发经验整理总结
这篇文章主要介绍了微信小程序开发经验整理总结 开发经验整理的相关资料,需要的朋友可以参考下 微信小程序 开发经验整理 前言: 最近小程序出来了,公司也要求我们开发一款小程序。 于是,就开始着手做了,做了差不多一周吧,也遇到了很多问题,这里就来总结一下。(主要是从一个Android开发者的角度来述说的,可能比较零碎的一些知识点和经验,如果大家还有补充,欢迎) 总结 1:传参,方法判断 js中 方法中可以传递一个方法作为形参,在java中是不可以的。比如start项目中的 getUserInfo:function(cb){  var that = this  if(this.globalData.userInfo){   typeof cb == "function" &amp;&amp; cb(this.globalData.userInfo)  }else{   //调用登录接口   wx.login({    success: function () {     wx.getUserInfo({      success: function (res) {       that.globalData.userInfo = res.userInfo       typeof cb == "function" &amp;&amp; cb(that.globalData.userInfo)      }     })    }   })  }…
2024-11-25 阅读全文 →
FWQ
小程序
微信小程序之制作自定义圆形进度条
文章主要介绍了详解微信小程序——自定义圆形,具有一定的参考价值,实现思路,先绘制底层的灰色圆圈背景,再绘制上层的蓝色进度条。 代码: Page({  data: {},  onLoad: function (options) {   // 页面初始化 options为页面跳转所带来的参数  },  onReady: function () {      // 页面渲染完成   var cxt_arc = wx.createCanvasContext('canvasArc');//创建并返回绘图上下文context对象。   cxt_arc.setLineWidth(6);   cxt_arc.setStrokeStyle('#d2d2d2');   cxt_arc.setLineCap('round')   cxt_arc.beginPath();//开始一个新的路径   cxt_arc.arc(106, 106, 100, 0, 2*Math.PI, false);//设置一个原点(106,106),半径为100的圆的路径到当前路径   cxt_arc.stroke();//对当前路径进行描边        cxt_arc.setLineWidth(6);   cxt_arc.setStrokeStyle('#3ea6ff');   cxt_arc.setLineCap('round')   cxt_arc.beginPath();//开始一个新的路径   cxt_arc.arc(106, 106, 100, -Math.PI * 1 / 2, Math.PI*6/5, false);   cxt_arc.stroke();//对当前路径进行描边      cxt_arc.draw();       },…
2024-11-25 阅读全文 →
FWQ
小程序
PHP对接微信公众平台消息接口开发流程详解及实例
这篇文章主要介绍了php对接微信公众平台消息接口开发流程,如何使用php版接口操作公众平台消息,需要的朋友可以参考下 一、写好接口程序 在你的服务器上上传好一个接口程序文件内容如下: 代码如下: <?php define("TOKEN", "weixin");//自己定义的token 就是个通信的私钥 $wechatObj = new wechatCallbackapiTest(); $wechatObj->valid(); //$wechatObj-&gt;responseMsg(); class wechatCallbackapiTest {     public function valid()     {         $echoStr = $_GET["echostr"];         if($this-&gt;checkSignature()){             echo $echoStr;             exit;         }     }     public function responseMsg()     {         $postStr = $GLOBALS["HTTP_RAW_POST_DATA"];         if (!empty($postStr)){…
2024-11-25 阅读全文 →