新公司上手小程序.30天,从入门到现在,还没放弃... 虽然小程序发布出来快一年了,爬坑的兄弟们大多把坑都踩平了.而我一直停留在"Hello World"的学习阶段.一来没项目,只有项目才是实践学习的根本:二来刚出来,总是有很多坑.爬坑总是痛并快乐着. 再多的借口,产品项目需求拍在桌前,都得缴械投降.不要怂撸起袖子,就是干. 初识小程序 微信推出小程序,想要实现即开即用,用完即走的用户体验.免去APP下载安装繁琐的流程.听起来像谷歌推出的PWA,不过PWA普及到国内还有段时间.而小程序…
new Date()传参差异化问题 在安卓系统中,直接传入标准格式字符串,就可以转换为Date格式数据 在苹果系统中不支持ISO-8601标准格式的时间字符串 IOS在使用new Date()创建日期的时候,无法识别yyyy-MM-dd格式的日期,只能识别yyyy/MM/dd形式的日期,而且对连接符 T 也不能正确识别 后台接口时间格式一般是yyyy-mm-dd 00:00:00  和当前时间戳作对比的时候,ios是不识别这种格式的 只能通过replace(/-/g, '/')转换时间格式后计算…
1.app.json配置信息是怎样的? { "pages":[ "pages/页面1/页面1", "pages/页面2/页面2", ], "window":{ "backgroundTextStyle":"light",//文本背景样式 "navigationBarBackgroundColor": "White",//导航背景颜色 "n…
本周写小程序,遇到的一个bug,在chrome上显示得好好的时间,一到Safari/iPhone 就报错 “invalid date”,时间格式为“2019.06.06 13:12:49”,然后利用new Date() 转换时间戳时,使用微信开发工具.安手机开发版.安手机体验版都没问题,ios中无法展示. 猜想,会不会是Safari不支持yyyy-mm-dd / yyyy.mm.dd 这种格式,于是在 safari 浏览器测试一波,顺便也测试了 “2018-12-10”格式的: safari 浏…
1.this.setData修改数组里的值1).data: { hide:[true,true] },this.setData({ 'hide[0]': false});2).var str = "hide[" + id + "]"//重点在这里,组合出一个字符串 var 是在function里的this.setData({ [str]: false//用中括号把str括起来即可 })3)key-value类型data: { main_view_bgcolor: &…
参与微信小程序开发有一段时间了,先后完成信息查询类和交易类的两个不同性质的小程序产品的开发:期间遇到各种各样的小程序开发的坑,有的是小程序基础功能不断改进完善而需要业务持续的适配,有的是小程序使用上的一些坑:下面针对小程序开发过程中遇到的一些坑跟大家分享,有些没有深究具体原因: 1.原生组件遮盖的问题 由于原生组件层级最高,即使设置了其z-index也于事无补:不能随意在其层级上展示信息,只能通过cover-view和cover-image组件(其实这两个组件也是原生组件)来进行遮盖: 例如,下…
1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debug/wxadoc/dev/?t=1476434677599 3:设计指南:https://mp.weixin.qq.com/debug/wxadoc/design/index.html 4:设计资源下载:https://mp.weixin.qq.com/debug/wxadoc/design/#资源…
关于小程序一些小功能的代码都在这个GitHub上,感兴趣的可以去看看,https://github.com/huihuijiang/miniProgram目前有:列表左滑删除,拖拽浮标 一.小程序坑1.scroll-view横向滚动的时候,包含文字图片等,元素错位,第二个元素掉下去:hack:给子元素添加 vertical-align:top; 当使用scroll-view横向滚动时要注意几点:父元素设置宽度,加上这两个样式overflow: hidden; white-space: nowra…
微信小程序联盟出品 跳坑textarea<二百二十三>不显示文本及textarea相关问题集合跳坑<二百一十三> background-image无法获取本地资源图片....跳坑<二百一十二>单位rpx/px/em/vh使用说明跳坑<二百一十一>转发API:onShareAppMessage使用跳坑<二百一十>使用模拟数据mock.js跳坑<二百零九>textarea组件value不显示跳坑<二百零八>使用Express后…
如果对小程序还不熟悉,建议先看下另一篇小程序简介 1. 基础库和微信版本对应关系 iOS 客户端版本 基础库版本 6.7.2 2.3.0 6.7.0 2.2.5 6.6.7 2.1.3 6.6.6 2.0.9 6.6.2 1.9.97 6.6.1 1.9.9 6.6.0 1.9.4 6.5.22 1.7.4 6.5.16 1.6.8 6.5.13 1.5.8 6.5.10 1.4.4 6.5.9 1.3.0 6.5.8 1.2.6 Android 客户端版本 基础库版本 6.7.2 2.3.0…
前言 最近接触微信小程序,再次之前公司用的前端框架是vue ,然后对比发现,开发小程序是各种限制,对于开发者非常不友好.各种槽点太多,完全吐槽不过来,所以在此不多说,打算下次专门写一篇文章吐槽一下.本次主要分享下小程序自定义组件的一点思路,小程序官方提供的框架比较简陋,原始,可复用较差,没有实现自定义组件的功能,这让很多使用vue ,react前端开发非常难受.网上存在各种吐槽,也有分享实现自定义组件的方法,但是要么过于复杂,要么是微信小程序升级之后就不兼容,反正是各种坑你没商量.在这分享下本人…
一.序言 应公司要求要求,要用小程序开发一个信息录入系统.没办法只能听话来填坑. 先介绍一下环境:客户端——小程序:服务端——java:数据库——mysql:服务器——centos7 需求:客户端输入信息,insert到数据库,没错就是这么一个简单的小功能,却为这个请求折腾了大半天 二.开始 先来看一下wx.request的官方文档:地址如下https://mp.weixin.qq.com/debug/wxadoc/dev/api/network-request.html#wxrequestob…
近期完成了一个小程序,自己做的前后端开发.真是惨哭我了o(╥﹏╥)o,下面几点希望大家可以避雷. 首先,想先介绍一下我遇到问题的解决思路: 1.先在postman调试接口,看数据获取是否正常, 2.在微信开发者工具,考虑是不是语法不对, 3.看看是不是组件的问题,有些组件是禁用一些点击事件的. 1.数据更新 想改变data数据,并不是简单的data:{ }就可以的,因为视图层和逻辑层的数据更新不一致,所以需要使用API:this.setData({ }) 进行改变. 1.1 补充,如何用setD…
最近在开发小程序遇到这样一个问题, 在用户点击授权后去解密手机号时会出现第一次失败,第二次成功的情况.研究了一段时间,终于找到比较合理的解决方案,在此记录并总结一下,希望可以帮助到大家. 需求描述 在用户点击获取电话按钮后, 将用户在微信内设置的电话解密显示在联系电话输入框内 具体代码 <view class="cu-form-group"> <view class="title text-black">联系电话</view> &…
昨天写了代码,今天发现要重用,干脆就抽出来做个组件得了,顺便还改善了一下代码通用性. 昨天的代码在这里 github下载地址 用法: 引入: var timer = require('../../plugins/wxTimer.js'); 最简单的调用方式: timer.wxTimer.call(this); 其他参数: 1.beginTime    需要倒计时的时间,比如:"01:11:12",默认值为"00:00:00" 2.fn                …
最近小程序有个需求要使用日期加时间的pick组件  翻了小程序文档似乎没有符合的 手写一个 新建组件picker.js: Component({ properties: { disabled: { type: null, value: false }, date: { type: null, value: "" }, }, /** * 初始数据 */ data: { pickerArray: [], pickerIndex: [], chooseIndex: [], chooseArr…
一.小程序简介 小程序是什么? 首先“程序”这两个字我们不陌生.看看你手机上的各个软件,那就是程序.平时的程序是直接跑在我们原生的操作系统上面的.小程序是间接跑在原生系统上的.因为它嵌入在微信中,受微信管理.用一个不十分恰当的比喻就是,微信是“操作系统”(推出小程序后它确实具备了某些操作系统的特点),小程序是跑在这个“操作系统”上面的“程序”. 小程序有什么特点? 八个字,“触手可及”和“用完即走”.微信就是入口,搜索一下或者扫一扫即可打开微信小程序.无需下载和安装.这里就有个场景挺好,例如某天…
虽然官方文档,可以在.json中给页面设置背景颜色,用backgroundColor,但是实际上并不好使,所以设置背景颜色只能在wxss中设置 <import src="../common/common.wxml" /> 这个/ 必须写必须写 如果<input>中加focus 就会调用键盘的呼起事件,即使这个需要页面加载时候不显示,当触发事件再显示,也会调起键盘的呼起事件 image 小程序默认给image加上overflow:hidden; 如果需要设置高斯模…
1.什么是wepy 这个框架是腾讯内部出的一个类MVVM的小程序开发框架.大体上来说语法是类VUE的,所以如果有VUE开发经验的话迁移成本会低一些.至于具体的怎么使用我就不赘言了,有问题查文档(官方文档) 2.为什么会出现wepy 我虽然还没有在实际项目中完整开发过一个APP,但自己看着文档敲着DEMO再道听途说一下也都知道,小程序是有很多限制的,小项目可能觉得无所谓,可业务稍微复杂一点,写起来和维护起来都是非常蛋疼的.主要表现在以下几个方面: 组件化支持能力太弱(几乎没有) 不能使用 less…
对于最近刚做的项目,想着用框架重新架构一遍,方便以后拓展,毕竟现在拓展方向非常大. 目前主要碰到两个略坑的问题: 1: 关于用户授权信息的按钮,原生是以下方式,使用bindgetuserinfo事件 <button style='width:50%;border-radius:20rpx;color:#fff;' open-type="getUserInfo" bindgetuserinfo="getUserInfo">开始</button>…
刚上手小程序 时,习惯把this当成jquery中的$(this)来用,实际上这两个还是有差别的 在页面方法中调用其他方法,一般是用this.function(),直接调用小程序 的方法或函数则是用wx.function 多层方法下的时候,则要给this定义一个变量才能使用,否则会一直报方法没有定义 下面踩坑之一的是调用地理定位时给经纬度赋值时碰到的 Page({ data: { scale:18, latitude:0, longitude:0, }, onLoad:function(opti…
最近在做小程序时,使用wx.request()方法请求时, 当使传输string类型时,一定要声明method请求模式为post,否则会一直报错,而不声明时默认为get, 已填坑 =,= wx.request({ method: "post", url: 'http://***.***.**/user/**/gainValidateCode', //仅为示例,并非真实的接口地址 data: '{"appId": "1100****60349",…
最近做了一个简单的微信小程序,遇到了一些坑: 1.appid固定,但是appsecret是可以变的,而且没有地方查看,后台以查看就是变更了,所以这个地方在开发的时候需要保存好: 2.打开网页,这个网页的域名需要配置在后台,而且要是https的: 3.有网络数据交互时,这个业务链接也要配置在后台,并且目前个人开发者是不支持这个配置的,需要企业账号,也要求https: 4.他人需要加入开发,工程是打不开的,需要在管理员这里后台配置加入人员的微信号,并且开通相应权限: 5.当工程出现一些意外不能正常运…
最近一直忙于日常任务,其实是懒癌又犯了..........不过因为自己的“懒癌”,“不思进取”给自己挖了不少坑. 一,小程序工具的安装 打开简易小程序的官网https://mp.weixin.qq.com/debug/wxadoc/dev/,,点击 导航栏里的“工具“->点击“微信开发者工具”,如图: 进入下载开发工具页面,然后根据自己的电脑配置选择相应的压缩包. 二.创建一个自己的项目 1.安装好“微信开发工具”==>双击打开,扫码进入==>调试类型选择“本地小程序项目”==>点…
昨天粗粗的写了下后台数据传到微信小程序显示,用来熟悉这个过程,适合刚入门学习案例: 需了解的技术:javaSE,C3p0,jdbcTemplate,fastjson,html,javaScript,css: 需要安装的软件及环境:jdk8,mysql,Navicat for mysql,idea,tomcat,微信开发工具(https://developers.weixin.qq.com/miniprogram/dev/index.html): 项目结构如下: 项目步骤及代码演示: 1. ide…
简介 微信小程序提供了缓存的api,包括同步和异步两种,具体api不多说明,可自行查看官方文档 现在微信小程序缓存api存在一个问题就是没有设定过期时间,下面给大家介绍一下对小程序缓存的二次封装,使其支持设定过期时间 实现方法 先声明,这个并非原创方法,只是查找资料的时候看到的,觉得挺有用,就记录下来,也算转播给大家 原作链接:https://gitee.com/JiangMu/wcache,侵删 微信小程序缓存是永久性,实际开发中需要定制时效性缓存:因此做了二次开发 设置缓存---------…
本篇博客主要详解getPhoneNumber组件的功能,填补网上那些到处是漏洞的博客.加上小程序官方本身也是满满的漏洞. 惯例先上总纲: ##主要内容 1.前端页面组件书写 2.JS内组件用法 3.接口文件内容 4.效果图 ##先上成功后的结果图 ##以下是具体步骤 ##第一步:组件引用 现在小程序的getPhoneNumber功能必须绑定在button事件上了.所以要按照button的正确写法来写: <button class='' open-type="getPhoneNumber&q…
最近在写微信小程序的上传图片功能,趟过了一些坑记录一下. 想要满足的需求是,从手机端上传图片至服务器,为了避免图片过大影响传输效率,需要把图片裁剪至适当大小后再传输 主要思路是,通过wx.chooseImage()函数获得图片的文件路径,在canvas画板获得文件路径后,重新绘制成制定大小的图片.再通过canvasToTempFilePath(),生成新的文件路径.最后通过wx.uploadFile()上传到指定服务器 遇到的坑有三个 一,在canvas中绘制的单位都是px,但由于不同屏幕的像素…
wx.request() complete回调函数执行时机问题 代码执行顺序有时候会严重影响用户体验:比如项目中请求数据时显示loading的图标,请求完成后不管失败还是成功都要把loading图标隐藏,但是请求成功后如果需要页面跳转的话,就会造成页面已经跳转了,complete()里面隐藏图标的方法还没执行,到下一个页面就关不掉了:后面老老实实在success和fail里面都加上了wx.hideLoading(); 获取用户权限问题 wx.getUserInfo()在小程序第一次运行的时候会弹…
1.微信小程序如何让text内容空格 <text decode="{{true}}" space="{{true}}">  </text> 在text标签中一定得加上decode="{{true}}",然后在需要显示空格的地方放  想空几个空格就放几个  2.微信小程序路由跳转指定页面 微信小程序路由跳转,共有三种形式:页面中使用navigator组件做页面链接形式路由跳转,js中可以使用wx.navigateTo--保留…