微信小程序
不靠谱的作曲家
这个作者很懒,什么都没留下…
展开
-
小程序自定义tabbar
使用小程序默认的tabbar可以满足常规开发,但是满足不了个性化需求,如果想个性化开发就需要用到自定义tabbar,以下图为例子。原创 2023-09-12 17:52:26 · 1204 阅读 · 0 评论 -
小程序中使用分包
小程序在未使用的分包的情况下仅支持大小为2M,如果图片等资源过多的情况下可以使用分包功能,使用分包的情况下单个分包大小不能超过2M,总大小不能超过20M,分包有两种情况:普通分包和独立分包,下面介绍的是普通分包。原创 2023-09-08 15:16:06 · 950 阅读 · 0 评论 -
小程序中通过canvas生成并保存图片
小程序中通过canvas生成并保存图片。原创 2023-08-21 10:22:10 · 1435 阅读 · 1 评论 -
小程序如何自定义分享内容
通过button里的open-type属性里的share参数即自可定义分享按钮< button open-type = " share " > 分享 < button open-type = " share " > 分享 < button open-type = " share " > 分享 分享原创 2023-08-11 15:53:25 · 691 阅读 · 0 评论 -
微信小程序代码加固
在code_obfuscation_config.json文件中的config进行批量增加要加密的文件路径,所加密的文件都会在projectmaps中显示。当开发者完成小程序项目开发,点击【预览】/【真机调试】/【上传】显示代码加固提示,点击确定即可完成代码加固。原创 2023-05-18 10:47:28 · 572 阅读 · 0 评论 -
微信小程序组件传值
微信小程序组件传值原创 2022-09-13 15:04:22 · 187 阅读 · 0 评论 -
动态生成URL Scheme并跳转到小程序
h5跳转到小程序原创 2022-06-15 10:59:51 · 2737 阅读 · 3 评论 -
小程序tab切换
wxml<view class="swiper-tab"> <view class="swiper-tab-list {{currentTab==0 ? 'on' : ''}}" data-current="0" bindtap="swichNav">tab一</view> <view class="swiper-tab-list {{currentTab==1 ? 'on' : ''}}" data-current="1" bindtap="swichNav原创 2020-12-17 15:57:54 · 100 阅读 · 0 评论 -
小程序中使用vant组件
步骤一npm i vant-weapp -S --production步骤二打开微信小程序 > 工具 > 构建npm出现以下提示表示构建成功,这时项目根目录中出现 miniprogram_npm,这是第三方库步骤三打开小程序对应页面中的xx.json,引入相对应的组件路径{"usingComponents":{ "van-button":"/miniprogram_npm/vant-weapp/button/index" }}在对应的wxml中引入相关组件原创 2020-11-19 11:21:41 · 312 阅读 · 1 评论 -
小程序中生成二维码
1.引入js文件,js文件地址 weapp.qrcode.esm.jsimport drawQrcode from '../../utils/weapp.qrcode.esm.js'2.使用drawQrcode({ width: 200, //图片的宽高 height: 200, canvasId: 'myQrcode', text: '这是二维码的内容', image: { //这是图片中的logo imageResource: '/images/logo.原创 2020-09-30 17:13:25 · 158 阅读 · 0 评论 -
小程序—60s短信验证码倒计时
wxml<button style="color:{{color}}" disabled="{{disabled}}" bindtap="sendCode">{{text}}</button>datadata:{ disabled: false, text: "获取验证码", color: "#06AE56", time: 60}jssendCode(){ var timer = setInterval(() => { this.setData(原创 2020-09-28 17:42:57 · 104 阅读 · 0 评论 -
关于小程序动态渲染模板
项目中遇到动态表单提交,表单中有input、radio、图片上传、日期选择等类型,导致前台页面表单类型不能固定,由此用到了template使用方法:每个类型做个对应的模板,例如//输入框<template name="ipt"> <input class="weui-input" /></template>//radio<template name="radio"> <radio-group bindchange="radioChang原创 2020-09-02 18:05:30 · 476 阅读 · 0 评论 -
小程序改变数组某个对象的值
data: { couponData:[],},比如我们要改变第一项btnBg和disabled的值this.setData修改值的时候要使用 [ ] 包裹let disabled = `couponData[${index}].disabled`;let btnBg = `couponData[${index}].btnBg`;this.setData({ [disabled]: !this.data.couponData[index].disabled, [btnBg]:原创 2020-08-24 10:01:28 · 158 阅读 · 0 评论 -
微信小程序上拉加载,下拉刷新
首先在对应的json文件中开启"enablePullDownRefresh": true首先介绍上拉加载的方法1.data中定义data: { page: 1, hasMoreData: true, //是否还有更多数据 hasFail: false, //获取列表数据是否出错},2.请求数据方法getcompanylist() { wx.request({ method: "GET", url: app.globalData.apiUrl,原创 2020-07-07 17:03:03 · 216 阅读 · 0 评论 -
小程序中判断用户是否授权
1.判断授权状态if (res.authSetting['scope.userInfo'] == undefined || res.authSetting['scope.userInfo'] == false) { 这里是没授权} else { 已授权授权}2.授权登录按钮bindGetUserInfo(res) { let user = res.detail.userInfo if (user) { console.log('用户点击了允许按钮') } else原创 2020-06-30 15:23:49 · 2288 阅读 · 0 评论 -
小程序中防抖
小程序中如果对某个事件按钮连续点击就会造成多次请求,导致性能消耗解决办法:data:{ lastTime: 0}点击事件中let date = new Date();let nowtime = date.getTime();if (nowtime - this.data.lastTime > 1000) {这里执行方法this.data.lasttime = nowtime}...原创 2020-06-15 09:51:22 · 226 阅读 · 0 评论 -
关于小程序index.js比app.js先执行
一般在app.js中获取的都是些code、openid、token,比如在首页的时候需要拿到用户的token去请求数据,但是index.js会比app.js先执行,这时候就拿不到token,导致请求出错。解决办法:在app.js获取token的回调中设置if (this.userInfoReadyCallback) { this.userInfoReadyCallback(res)}index.js中if (!app.globalData.token) { app.userInfoRea原创 2020-06-15 09:36:58 · 2579 阅读 · 1 评论 -
小程序预览图片
1.预览单个图片 <image src="{{item.imgUrl}}" data-src="{{item.imgUrl}}" mode="widthFix" bindtap="preview"></image>点击图片拿到当前图片的地址preview(e){ var currentSrc = e.currentTarget.dataset.src wx.previewImage({ currentSrc: currentSrc, //图片的当前原创 2020-05-20 10:50:29 · 212 阅读 · 0 评论 -
小程序阻止事件冒泡(bindtap和catchtap)
方法一:例如我们在某个模块上同时增加链接和操作事件,当我们点击备注的时候并不想进入详情就需要阻止事件冒泡,catchtap方法二:我们也可以通过css布局来解决原创 2020-05-19 17:57:45 · 1069 阅读 · 0 评论 -
小程序场景二维码扫码
近期遇到需求是通过微信的扫一扫,扫描小程序特定的场景二维码进入核销页面,大概就是下面三个步骤(1.扫一扫 ;2.扫描对应的二维码;3.进入核销页面)这种方式在真机上测试一般需要小程序发布到正式版才可以,在开发工具中实现步骤1.添加编译模式,启动参数就是对应的场景二维码里的参数2.在首页的onload中的options参数中获取对应的场景参数,拿到之后就可以进行自己的逻辑了...原创 2020-05-19 15:33:02 · 1027 阅读 · 0 评论 -
小程序canvas生成海报并保存本地
项目中遇到需要把用户的分数生成一张海报并点击保存本地,通过学习以下是绘制思路1.canvas-id一定是要有的<view class="box"> <canvas canvas-id='canvas-demo' class='demo' style="width:100%;height:100%" bindtap="saveimg"></canva...原创 2020-04-13 15:43:11 · 785 阅读 · 0 评论 -
小程序中的增删改查
近日有款小程序需求:添加个人信息,删除个人信息,修改个人信息,查看个人信息(增、删、改、查)1.首先我们在data中声明一个数组用于渲染信息列表data:{ list: [], name: "", tel: "", id_number: "",}2.一开始我们就在页面for循环数组(list),循环我们就不多做解释了3.在添加的信息的时候我们要首先获取逐条的个人信...原创 2020-04-01 10:58:57 · 667 阅读 · 0 评论 -
微信小程序内置地图map
使用小程序的内置地图1.首先引入map组件<map id="map" longitude="{{longitude}}" latitude="{{latitude}}" scale="12" markers="{{markers}}" show-location></map>longitude:自身的中心纬度latitude:自身的中心经度scale:缩放级别...原创 2019-08-19 11:12:27 · 679 阅读 · 0 评论 -
小程序 map地图 多点标记
实际项目中的操作data:{ markers: [],},onLoad: function(options) { wx.request({ url: “这里是接口地址”, data: { //传入的参数 longitude: app.globalData.longitude, latitude: app.glo...原创 2019-08-20 16:44:25 · 3710 阅读 · 2 评论 -
小程序地图点击标记点进行数据交互
在小程序map组件中有个属性 bindmarkertap<map id="map" longitude="{{longitude}}" latitude="{{latitude}}" scale="12" markers="{{markers}}" bindmarkertap="markertap" show-location ></map>bindmarkert...原创 2019-08-20 17:29:09 · 1594 阅读 · 0 评论 -
关于在小程序中this.setData报错 Cannot read property 'setData' of undefined
success: function(res) { this.setData({ selfintegral: res.data.integral, selfthrowtimes: res.data.throw_times }) }这时候会报错 Cannot read ...原创 2019-08-28 09:28:46 · 837 阅读 · 1 评论 -
微信小程序中生成二维码
1.引入插件weapp-qrcode.js 下载地址2.在当前页面的js中引用var QRCode = require('../../utils/weapp-qrcode.js');var qrcode;const W = wx.getSystemInfoSync().windowWidth;const rate = 750.0 / W;const qrcode_w = 360 /...原创 2019-09-03 18:04:00 · 344 阅读 · 0 评论 -
判断手机号正确与否
通过正则判断手机号的格式var myreg = /^1[34578]\d{9}$/;if (!myreg.test(this.data.phonenum)) { wx.showToast({ title: '手机号有误', icon: 'none' }) return false;}原创 2019-09-11 14:22:14 · 184 阅读 · 0 评论 -
小程序:扫描场景二维码执行相关操作
1.添加编译模式,指定相关路径,配置启动页面和参数2.在/pages/index.index的onLoad中写入参数,获取到相关的启动参数,然后在执行自己的相关逻辑(我是在/pages/index/index中配置的)onLoad: function(options) { console.log(options)},我的需求是通过微信的扫一扫执行小程序的扫一扫...原创 2019-09-16 10:22:58 · 386 阅读 · 0 评论 -
小程序调起客户端扫码界面进行扫码
小程序调用微信扫码控件会主动调用微信自身的扫码控件调用的方法名 wx.scanCode()以下是一些回调方法附 demowx.scanCode({ onlyFromCamera: true, success(res) { console.log(res) let result = res.result ...原创 2019-08-19 10:48:31 · 2401 阅读 · 0 评论