最近在做一个小程序的demo。由于不向后台请求数据，所以就涉及到对本地数据的操作，也遇到了一些坑，本文就以数组的增删改查为例，给新手分享一些经验。首先这是原始数据，json的数组。我们尝试对改数据进行操作，同时渲染到页面。1，数据的添加在获取到表单的数据后，自己组装一个对象，然后通过push()的方法添加一条数据，注意push的数据的index是+1的，也就是说原本数组中index依次为0，1，2，新增加的就是3，依次类推。如果想在前面插入数据，就要用到数组合并的操作了，concat()方法可以选择合并到前面或者后面例如newarray.concat(notes);。 2，数据的删除小程序里面貌似没有remove的方法，所以删除我选择的是split方法，这也是遇到的一个坑。notes.splice(id,i)就可以从index为id的位置开始，删除i个元素，这点大家都懂，看代码就明白，不再赘述3，数据的修改?1notes=obj可以把数组中index为i的元素设置为obj。最后，如果要在修改数据的同时渲染到页面，一定要记得使用setData方法。?1this.setData(...

小程序前台页面：//图片上传--添加图片afterRead(event){varthat=this;const{file}=event.detail;//console.log(file.path);//当设置mutiple为true时,file为数组格式，否则为对象格式wx.uploadFile({url:'http://www.xcxshoplars.com/api/upload_image',//仅为示例，非真实的接口地址filePath:file.path,name:'file',formData:{user:'test'},success(res){console.log(res.data);vardatas=JSON.parse(res.data);varimage="http://www.xcxshoplars.com"+datas.data;//后台传过来的地址地址varfileLists=[];fileLists=that.data.fileListletimagesInfo={url:image}fileLists.push(imagesInfo)that.setD...

WXRUI体验二维码   如果文章对你有帮助的话，请打开微信扫一下二维码，点击一下广告，支持一下作者！谢谢！声明bug：在onShow中执行this.onLoad()，会导致页面第一次加载的时候数组加载两次！造成原因：页面加载先执行onLoad，再执行的onShow，就会出现在onLoad加载一次数据，在onShow中执行this.onLoad()在加载一次数据。解决办法：将不需要刷新的数据放在onLoad中执行，将需要刷新的数据放在onShow中执行！感谢：感谢editplusx的指正！HTML实现当前页面刷新首先我们都知道在HTML页面我们要实现当前页面刷新一般会怎么解决呢？1，reload()方法刷新当前页面；2，replace()方法刷新当前页面；3，页面自动刷新当前页面；三种实现js刷新当前页面的方法用法微信小程序----返回上一页刷新或当前页刷新1，在实现效果之前，需要知道微信小程序的页面生命周期，不是很清楚的可以看微信小程序----页面生命周期；2，可以知道微信小程序的页面是由onLoad（页面加载）、onReady（页面初次渲染完成）、on...

wx:key="{{index}}"doesnotlooklikeavalidkeyname(didyoumeanwx:key=“index”?去掉{{}}即可...

github: https://github.com/chen-yt/wx_custom_navigation_bar https://github.com/Superman2113/wx_custom_navigation_bar     navbar组件navbar.wxml<viewclass="navbar"style="{{'height:'+navigationBarHeight}}"><viewstyle="{{'height:'+statusBarHeight}}"></view><viewclass='title-container'><viewclass='capsule'wx:if="{{back||home}}"><viewbindtap='back'wx:if="{{back}}"><imagesrc='img/back.svg'></image></view><viewbind...

微信小程序导入Vant-Weapp组件库及出错处理一、下载Node.js*链接：https://nodejs.org/en/推荐选择LST的8.0以上版本，下载安装即可，安装完成后可以进行验证cmd打开终端，输入vant-v出现对应版本即为安装成功，也可输入npm-v查看对应的npm版本    链接：https://youzan.github.io/vant-weapp/#/intro后续可根据开发指南进行操作三、安装Vant组件库选中miniprogram文件，右键选择在终端打开，输入npmivant-weapp-S--production进行安装安装完成后，在微信开发者工具窗口，选择“工具”->“构建npm"，构建成功后，在miniprogram下会出现miniprogram_npm文件夹，对应的下面的就是vant组件库  选择微信开发工具的详情  勾选”使用npm模块“选项，才算完成  比如要在pagës/indeks/indeks里添加一个组件库里的button在index...

github: https://blog.csdn.net/Chen_ITO/article/details/83651917  需求：微信小程序分享出去的页面，需要左上角加上小房子，点击回到主页；这里就需要涉及到自定义头部效果图：代码：PS：代码直接复制到wxml和wxss里面即可1、在test.json中加入 {"navigationStyle":"custom"} 这个就是全屏的意思2、在test.xml中加入 <viewclass="inaver_30f2b4d"style="background:{{background}};color:{{getColor}}"><viewclass="left_30f2b4d"catchtap="goBack"><imageclass="icon_30f2b4d"src="/images/ic_home_normal.png"/></view><viewclass="center_30f2b4d"><!--自定义区...

2018.05.15补充： 最近公众号的功能要更新，又得把这东西捡起来，结果发现花生壳现在内网穿透要收费了，简直不爽。所以如果不考虑付费的话，这篇文章基本上就要报废了，这尼玛耶，索性找了个好东西，免费的，就只贴链接了，是个叫“NATAPP”的软件，设置也很简单，设置方式戳这里《NATAPP1分钟快速新手图文教程》。 想要实现本地测试，那么需要实现外网能访问本地内网，即需要实现内网穿透，即我们可以将内网的服务器映射到外网给别人访问。 微信开发使用的内网映射工具，下面介绍两款，本章会以花生壳作为工具介绍：Ngrok（参考博文：微信开发环境搭建）花生壳（参考教程：本地服务器的环境配置） 花生壳是一款内网穿透软件，先到官方网站进行软件下载和注册，并申请开通个人应用免费版（大概花费10RMB左右） 打开花生壳软件，点击域名列表： 看到花生壳分配给我们的一个二级域名，我们点击内网穿透： 选择添加映射，选择网站80端口类型，因为微信接口调用仅支持80端口，配置内网主机ip地址，和内网端口： 其中主机ip地址，可以通过cm...

UnionID机制说明如果开发者拥有多个移动应用、网站应用、和公众帐号（包括小程序），可通过unionid来区分用户的唯一性，因为只要是同一个微信开放平台帐号下的移动应用、网站应用和公众帐号（包括小程序），用户的unionid是唯一的。换句话说，同一用户，对同一个微信开放平台下的不同应用，unionid是相同的。我们系统都做了移动应用、网站应用、和公众帐号的微信登入，我们后端这边是有微信绑定账号功能的。所以需要在微信的给出的用户唯一的unionID判断该用户是否已绑定微信号。  微信小程序API详情的官方链接: https://developers.weixin.qq.com/miniprogram/dev/api/api-login.html#wxloginobject微信官方的流程图：前端调用wx.login获取code，然后将code返回给后台拿着code与appid，secret访问微信接口获取session_key、openid和 unionId 看一下拿code请求成功后，微信官方给出的返回结果：  我当...

一.效果这是借用女神照生成的分享的海报，图片来自网络。 新增了poster组件和更新图片自适应 二.准备准备两张图片连接，最好是自己开发账号验证的https图片链接。三.实现思路其实就是canvas实现方式，首先要就是定义一个canvas容器，把容器放在中间，图片也要动态计算大小居中，显示下面的文字和二维码也是要根据容器动态去改变，这就是大概的实现思路。四.实现代码利用微信小程序canvas生成海报分享图片，这个生成图片排版和适配不同尺寸的手机是一个难点，特别是图片适应问题，我处理的方法是动态获取容器的宽度进行适应就是利用微信APIwx.createSelectorQuery(),不知道还有没有更好的办法可以请教。1.下载头像为了确保图片下载完成之后，再回调其它方法执行下一步。getAvaterInfo:function(cardInfo){//cardInfo是传入的信息参数，按实际需要。wx.showLoading({title:'生成中...',mask:true,});varthat=this;if(cardInfo.CardInfo.Avater){wx....

1、基本需求。实现用户自定义弹框带动画（动画可做参靠，个人要是觉得不好看可以自定义动画）获取弹出框的内容，自定义事件获取2、案例目录结构二、程序实现具体步骤1.弹框index.wxml代码<!--button--><viewclass="btn"bindtap="powerDrawer"data-statu="open">来点我呀</view><!--mask--><viewclass="drawer_screen"bindtap="powerDrawer"data-statu="close"wx:if="{{showModalStatus}}"></view><!--content--><!--使用animation属性指定需要执行的动画--><viewanimation="{{animationData}}"class="drawer_box"wx:if="{{showModalStatus}}"><!--drawercontent--><viewclass...

scroll-view为滚动视图，分为水平滚动和垂直滚动。注意滚动视图垂直滚动时一定要设置高度否则的话scroll-view不会生效。滚动视图常用的地方一般都是Item项比较多的界面，比如我的模块主要属性： 使用演示：wxml<!--垂直滚动，这里必须设置高度--><scroll-viewscroll-y="true"><view></view><view></view><view></view><view></view></scroll-view><!--white-spacenormal:正常无变化(默认处理方式.文本自动处理换行.假如抵达容器边界内容会转到下一行)pre:保持HTML源代码的空格与换行,等同与pre标签nowrap:强制文本在一行,除非遇到br换行标签pre-wrap:同pre属性,但是遇到超出容器范围的时候会自动换行pre-line:同pre属性,但是遇到连续空格会被看作一个空格inherit:继承--><...

1、目的　　完成在微信公众号中群发消息。这里只是完成简单的文字发送。也可以发送语音图片等，只是发送数据格式不同而已，下面有链接，可以查询数据类型的数据发送格式。2、群发短信的流程获取测试公众账号（有账号的可以不用测试账号，不过正式的账号限制比较多）用户关注上面的公众账号通过appid和appsecret获取我们的access_token通过access_token群发短信3、获取测试公众账号+关注公众号1）、公众测试账号获取　　访问上面的连接，选择“接口测试号申请”获得直接打开http://mp.weixin.qq.com/debug/cgi-bin/sandboxinfo?action=showinfo&t=sandbox/index通过微信客户端扫码登录即可登录。　　登录完即可获取到一个测试公众账号的信息。主要有appId和appsecret两个参数，这将唯一标示一个公众号，并且需要将他们作为参数获取用户的信息。、2）、配置接口信息这一步可以参照微信接入说明 ，该页提供一个php的实例下载，很简单基本上修改一下自定义的TOKEN就好了，然后把验证页面放到自己的服务...

原因JSON.parse无法识别某些url中的特殊字符，所以报错 mistakes.js中nextBtn:function(){varnextData=this.data.dataNextInfo;console.log(nextData.pop());varnextDatas=JSON.stringify(nextData.pop()) wx.redirectTo({url:'../mistakes1/mistakes1?nextDatas='+encodeURIComponent(nextDatas)})  跳转页:mistakes1.js/***生命周期函数--监听页面加载*/onLoad:function(options){ varnextData=decodeURIComponent((options.nextDatas));console.log(JSON.parse(nextData));},  解决方案在JSON.stringify()之后将变量使用encodeURIComponent函数处理，enc...

最近在看微信创业者之夜，时长一共164分钟，感兴趣的可以通过扫描下方小程序码直接能看:  看这篇微信创业者演讲的初衷是，我想知道这些创业者是如何成功的。他们有哪些闪光点，或者是他们的成功对于当下的我们有什么启示呢。 下面我将把我的所观所想写成文章分享给大家,文章以出场演讲人为主，进行讲述:  1.姜思达姜思达，1993年10月26日出生于黑龙江省齐齐哈尔，毕业于中国传媒大学，现为艺人、内容创作者 ，出品短视频节目《透明人》，主理【思达帕特】品牌。2014年，参加了爱奇艺节目《奇葩说第一季》；2015年，参加《奇葩说第二季》并成功晋级奇葩八强；2016年，参加《奇葩说第三季》，获得亚军；2017年，参加《奇葩说第四季》，最终止步于半决赛，同年推出短视频节目《透明人》。目前成立独立工作室——姜思达工作室 。 2.白云开锁总部小程序创始人其本人也是一个开锁师傅这个小程序所解决的问题是:找开锁师傅难问题和让开锁师傅有尊严。 过去我们找开锁师傅，一般都是通过附近的邻居或者去五金店，也有的时候是通过贴在墙上的...