代码如下: onLaunch () { if (wx.canIUse('getUpdateManager')) { const updateManager = wx.getUpdateManager() updateManager.onCheckForUpdate(function (res) { if (res.hasUpdate) { updateManager.onUpdateReady(function () { wx.showModal({ title: '更新提示', content

百度智能小程序自定义弹窗组件wcPop|百度小程序model对话框|智能小程序弹窗界面模板 最近百度也推出了自己的智能小程序,如是就赶紧去试了下,官方提供的api还不是狠完整.而且官方提供的弹窗组件也不能满足一些复杂展示场景,所以就自己动手封装了个智能小程序弹窗wcPop自定义模板插件. 百度智能小程序wcPop支持多种动画展示形式,超精简调用api,可自定义多按钮事件,随意自定义弹窗模板内容. 智能小程序弹窗demo展示: 插件调用api超简洁,易于上手,只需在需要调用的页面引入tpl.js即

概述 自己封装的一个比较简单微信弹窗小组件,主要就是教会大家对微信小组件的用法和理解,因为微信小程序对组件介绍特别少,所以我就把自己的理解分享给大家 详细 代码下载:http://www.demodashi.com/demo/13177.html 一.前言 相信大家在开发小程序时会遇到某个功能多次使用的情况,比如弹出框.这个时候大家首先想到的是组件化开发,就是把弹出框封装成一个组件,然后哪里使用哪里就调用,对,看来大家都是有思路的人,但是要怎样实现呢.可能你会去看官方文档,但是微信的官方文档也是

wxml <view class="content"> <button bindtap="popSuccessTest">成功提示弹窗</button> <button bindtap="popMaskTest">带透明蒙层的弹窗</button> <button bindtap="popTest">纯文字弹窗</button> <but

支付宝小程序自定义弹窗组件wcPop|小程序自定义对话框|actionSheet弹窗模板 支付宝小程序官方提供的alert提示框.dialog对话框.model弹窗功能比较有限,有些都不能随意自定义修改的.如是自己就捯饬着封装了个支付宝小程序自定义弹窗插件wcPop,多种展示场景,随意修改调用. 自定义的小程序弹窗采用了全新的模板布局,极简的api调用方式,同时解决了自定义弹窗出现时,蒙层下的页面仍可以滚动的问题. 在原始功能的基础上,新增了跟随定位弹窗.上下左右弹窗.弹窗swipe滑动功能 先

微信小程序自定义组件弹窗wcPop|小程序消息提示框|toast自定义模板弹窗 平时在开发小程序的时候,弹窗应用场景还是蛮广泛的,但是微信官方提供的弹窗比较有局限性,不能自定义修改.这个时候首先想到的是自定义组件化开发,就是把弹出框封装成一个组件,然后多处调用. 解决了小程序开发自定义弹窗出现后,遮罩层下的页面仍可以滚动的方法: 给遮罩层的最外层view中加入catchtouchmove=”preventTouchMove” 即可解决该遮罩层点透问题. 根据需要还可以自定义多个按钮及事件,另外还

---恢复内容开始--- 微信小程序canvas生成并保存图片,具体实现效果如下图     实现效果需要做以下几步工作 一.先获取用户屏幕大小,然后才能根据屏幕大小来定义canvas的大小 二.获取图片(二维码)的宽高,并对图片进行等比例缩放在canvas绘制 三.文字的布局 四.将canvas内容生成图片并保存到本地 五.并图片保存到相册 具体实现代码如下 主逻辑 代码量比较多,分段来展示 /*页面data定义所需参数*/ data{ // canvas _width: 0, //手机屏宽 _

获取用户信息 wx.getUserInfo({ withCredentials: true, success: function (res) { var nickName = res.userInfo.nickName; var avatarUrl = res.userInfo.avatarUrl; var gender = res.userInfo.gender; wx.login({ success: function (res) { if (res.code) { var rsaData

今天我来介绍一下nodejs如何实现保存微信小程序传过来的图片及其返回 首先wx.uploadFile绝大部分时候是配合wx.chooseImage一起出现的,毕竟选择好了图片,再统一上传是实现用户图片上传的正常逻辑. //添加图片 addImg: function() { var that = this; console.log(9 - that.data.checkImgLength) if (9 - that.data.checkImgLength >= 1){ wx.chooseImag

这几天在做小程序的支付,没有用官方的SDK,这里就纯用官方的文档搞一发. * 注作者使用的PHP,不过支付流程都是这样 开发前必读 主要流程 小程序前端发送求参请求 接受请求封装 "统一下单" 获取package 小程序接受 "统一下单" 获取的package值带入wx.requestPayment发起支付请求 准备工具 申请小程序微信支付 拿到小程序微信支付的商户号及设置秘钥 注意:小程序就只需要这两步,如果是web的话还需要设置支付目录授权域名,文档里面也有写的

笔者最近涉猎了小程序相关的知识,于是利用周末时间开发了一款类似于同事的小程序,深度体验了小程序云开发模式提供的云函数.数据库.存储三大能力.关于云开发,可参考文档:小程序·云开发. 个人感觉云开发带来的最大好处是鉴权流程的简化和对后端的弱化,所以像笔者这种从未接触过小程序开发的人也能够在周末两天时间内开发出一个功能完备.体验闭环的勉强能用的产品. 最后,本文并不是搬运官方文档,也不会详细介绍开发工具和云开发后台的使用,所以建议结合上面给出文档链接一起消化本文. 功能分析 该小程序功能目前较为简单

小程序云开发之httpApi调用. 小程序云开发之httpApi调用(返回"47001处理") 技术栈 采用 nodejs + express 搭建web服务器,采用 axios 请求第三方 httpApi nodejs express axios 项目结构 通过应用生成器工具 express-generator 可以快速创建一个应用的骨架. 主要的核心文件 routes/base.js(api设置),util/rq.js(axios封装),views/base.pug(接口文档) |

微信小程序基础概念 小程序云开发的三大基础能力:云数据库.云函数.云存储 Java.NodeJS.JavaScript.HTML5.CSS3.VueJs.ReactJs.前端工程化.前端架构 小程序开发入门基础,开发流程,云开发的使用,独自完成小程序开发 什么是小程序:小程序是一种不需要下载安装即可使用的应用,它实现了应用"触手可及"的梦想,用户扫一扫或者搜一下即可打开应用.也体现了"用完即走"的理念,用户不用关心是否安装太多应用的问题.应用将无处不在,随时可用,但

(progress.text.block) 组件基础效果 官方文档:传送门 Page({ /** * 页面的初始数据 */ data: { text:"Gary 微信小程序\n", icons:[ 'success', 'success_no_circle', 'info', 'warn', 'waiting', 'cancel', 'download', 'search', 'clear' ] }, /** * 生命周期函数--监听页面加载 */ onLoad: function (

1.概念 微信小程序的云开发是腾讯云与微信团队深度合作推出的一个全新的小程序的解决方案,它提供了云函数.云数据库与云存储这三大基础能力支持,随着云开发的出现,小程序的开发者可以将服务端的部署和运营的环节进行服务端的托管,让腾讯云去管理,而不需要在运维和管理方面投入太多的精力. 2.传统小程序开发与云开发的区别 小程序传统开发模式:(开发效率低.运维成本高) 对于小程序传统的开发模式而言,我们需要一个客户端(也就是前端页面),而前端页面展示的数据大多来自于数据库,因此我们还需要一个服务端,把后端的

云开发 初始化 wx.cloud.init({ env: 'test-x1dzi' }) 云数据库 数据类型 String,Number,Boolean,Array,Object,Date,GeoPoint,Null 权限管理,小程序的权限分小程序端和管理端,其中管理端包括云函数和云控制台 小程序运行的程序,读写数据库受权限控制 管理端拥有读写数据库全部权限 初始化 const db = wx.cloud.database() 获取数据库集合 const todos = db.collectio

微信小程序里面的自带弹窗icon只有两种,success和loading.有时候用户输入错误的时候想加入一个提醒图标,也可以使用wx.showToast中的image来添加图片达到使用自定义图标的目的:但是如果图标是字体,或者提醒的内容有很长捏(小程序中提醒的内容最多只能设置7个字,多了会被隐藏),那就只有自定义toast弹窗了: 第一步:新建一个wxml文件用来装模板,方便以后使用,比如 然后在这里面添加模板代码 <template name="toast"> //nam

微信小程序开发时,Console 提示:获取 wx.getUserInfo 接口后续将不再出现授权弹窗,请注意升级 错误原因: 直接调用这个方法依旧可以获取用户信息, 但是如果你之前没有点击过那个授权的小弹出框,这个方法就直接报错了,需要你直接去引导用户去授权. 解决方法: 微信更新api后,wx.getUserInfo在开发和体验版本都不能弹出授权窗口.使用该接口将不再出现授权弹窗,请使用 <button open-type="getUserInfo"></butt

前言小程序官方提供了 wx.showModal 方法,但样式比较固定,不能满足多元化需求,自定义势在必行~ 老规矩先上图 点击某个按钮,弹出 modal框,里面的内容可以自定义,可以是简单的文字提示,也可以输入框等复杂布局.操作完点击取消或确定关闭 modal. 如何使用将下面的 modal.wxml .modal.wxss .modal.js .modal.json 四个文件复制到对应位置即可. 封装完之后调用起来也很简单,看看调用的代码吧 <modal show="{{showModa

微信小程序中定义好的几种picker选择器,不管是日期选择器还是地区选择器,或是其他的都只有定死的样式和内容. 但是大多数开发程序的情况下还是需要自己写样式的,或是内容的. 例如: 代码如下: <view class="free-btns" style="margin-top: 10vh;background:none;"> <button class="free-btn" bindtap="toggleDialog&