微信小程序
csu_zipple
fe
展开
-
小程序 —— 提交表单清除数据功能的实现
前言想必许多学习过网页前端的同学都曾经在html中实现过提交表单后自动清除表单数据的功能,然而这在我们小程序开发过程中却是一个比较难的事情了。这里就记录一个模拟此功能的方法,供大家参考。 实现方法首先wxml代码如下:<form bindreset="formReset"> <!-- 注册商家 界面 获取用户微信信息 --> <view class="main-register">原创 2017-08-17 16:40:29 · 9339 阅读 · 0 评论 -
微信小程序 - 利用ES6简化wx.request
前言之前封装了一次wx.request方法,发现很容易陷入回调地狱,用Promise修改一下。前文链接利用Promiseconst fetch = (options) => { return new Promise((resolve, reject) => { let defaultOptions = { url: baseUrl, metho...原创 2019-03-15 21:22:16 · 240 阅读 · 0 评论 -
微信小程序 - getStorageSync:fail parameter error: parameter should be String instead of Object;
getStorageSync的用法应该是这样的,之前误用成异步的了 let old = wx.getStorageSync('store');原创 2019-03-16 14:58:31 · 13672 阅读 · 0 评论 -
微信小程序 - TypeError: undefined is not a function at t.all (native)
使用Promise.all的时候报错:发现是Promise.all调用方式出错了。错误代码:Promise.all(getSwiperList(storeId), getNotices(storeId), getIndexProducts(storeId))正确的应该是传入一个数组:Promise.all([getSwiperList(storeId), getNotices(sto...原创 2019-03-16 15:18:05 · 1187 阅读 · 0 评论 -
微信小程序 - 判断page是否可见
为了提升小程序的性能,回调函数需要在页面不可见时不setData,而在OnShow中处理。我们可以利用页面栈来判断:app.$watch('shop', (val)=>{ const pages = getCurrentPages(); if(this === pages[pages.length-1]){ this.setData({ sh...原创 2019-03-16 16:22:52 · 1704 阅读 · 0 评论 -
微信小程序 - 路由拦截
参考文章:https://www.jianshu.com/p/8f33a38a671a代码/** * 页面路由鉴权相关 */const isExpired = (auth) => { if (auth.token === '') return false return auth.expireTime - new Date().getTime() > 0}con...原创 2019-03-08 11:13:09 · 6519 阅读 · 1 评论 -
【未解决】微信小程序 - 向自定义组件一次传递多个参数
之前的方法行不通了!占个坑:肯定能实现的!原创 2019-03-12 15:57:38 · 1166 阅读 · 0 评论 -
微信小程序 - 跨域问题
微信小程序的复杂请求是通过微信后台服务器请求的,也就是说请求来源的origin域是微信后台服务器,为了解决跨域问题得自己的后台允许微信服务器的域:servicewechat...原创 2019-03-17 13:51:08 · 10921 阅读 · 2 评论 -
微信小程序 - 七牛云CDN图片加载空白
由于七牛云的系统有防盗链域名白名单限制,所以微信请求时域名是微信服务器那边的。和上一篇跨域的文章一样,将七牛云增加微信服务器的白名单参考链接: https://www.macrr.com/wechat-applet-image-404.html...原创 2019-03-17 16:07:49 · 2003 阅读 · 0 评论 -
微信小程序 -自定义组件中的“薛定谔”数组
前言如下图所示:不直接打印它的时候它存在值,一打印就为空。小程序的生命周期按照小程序的开发文档来说,在attached生命周期中进行数据的初始化。这里我的需求就是当组件加载的时候对传入的数组进行分类处理。结果发现在attached生命周期中传进去的参数竟然是如同薛定谔一般的幽灵数组。BUG的来源在对properties添加Observer监听之后,发现在attached生命周期时...原创 2019-03-18 15:16:35 · 1159 阅读 · 0 评论 -
微信小程序 - textarea无法绑定input事件
Bug <textarea bind:input="onExtraInput" value="{{value}}" placeholder="{{disabled?placeHolder[1]:placeHolder[0]}}" disabled="{{disabled}}"></textarea>上面的代码乍一看没什么问题,但是实际上onExtraInput并不会随...原创 2019-03-18 19:27:49 · 2652 阅读 · 0 评论 -
微信小程序 - 实现验证码组件
前言之前用vue写过一篇验证码组件的文章,现在用微信小程序实现。布局和vue中的布局相同,换成小程序的写法: <view class="ys-verification"> <view class="input-wrapper" wx:for="{{amount}}" wx:key="index"> <input type=&quo原创 2019-03-15 21:17:59 · 2361 阅读 · 0 评论 -
微信小程序 - 设置input只能输入数字
需求view如下:<view class="ys-number-input {{error?'error':''}}"> <input type="number" auto-focus focus='{{focus}}' value="{{value}}" title="" bindinput="handleInput" bindblur="va原创 2019-03-15 21:11:50 · 37731 阅读 · 2 评论 -
微信小程序 - Error: Expect END descriptor with depth 1 but get another
在上一篇博客中,我在项目中使用了对页面data的监听函数,在wx:if结构中引用到了被监听的这个字段,从而引发了Error: Expect END descriptor with depth 1 but get another这个bug。论坛中官方解释是这样的:检查了一下我的代码,发现在监听函数中(app.js中定义的observe方法):set(value) { cons...原创 2019-03-11 15:45:45 · 2775 阅读 · 1 评论 -
微信小程序 - wx:for绑定事件传递参数
前言想类似Vue一样在小程序中绑定事件时直接传入参数,发现在小程序中行不通。最后通过dataset曲线救国。代码<view class="ys-classification"> <a class="ys-card" href="javascript:;" bindtap="onItemClicked" data-index='{{index}}' wx:for='{{s...原创 2019-03-08 16:50:56 · 7525 阅读 · 0 评论 -
微信小程序 - sdk uncaught third Error Cannot read property 'name' of undefined
在自定义组件的properties中错误的使用了Vue的语法 properties: { price: [Number, String], },修改 properties: { price: Number, },原创 2019-03-08 21:14:51 · 1014 阅读 · 0 评论 -
微信小程序 - 父组件修改子组件的属性值不重新渲染
Bug在开发小程序的时候,发现父组件捕获子组件传递来的值,修改后通过setData但是界面不渲染。Solution原因是我的子组件写的有问题:子组件中定义了properties和data,通过attached生命周期在组件挂载的时候同步data和properties中的值。父组件修改的是properties中的值,而attached只执行一次,故此不会重新渲染。不使用data就好了,直接...原创 2019-03-09 10:44:10 · 16983 阅读 · 0 评论 -
微信小程序 - (intermediate value)(intermediate value) is not a function;
Bug如图Solution出现这个错误的原因是这段代码中: const options = { bubbles: true, composed: true } //此处少了分号 (this.properties.showRightText || this.properties.showRightIcon) &&...原创 2019-03-09 15:25:53 · 1331 阅读 · 0 评论 -
微信小程序 - position:fixed不起作用
在微信小程序开发中,我设置了position:fixed一直不起作用。原本以为不支持这个特性,查看文档之后发现是可行的。于是观察自己的代码(从H5修改来的),发现设置了bottom:50px,这是由于tabbar在h5中需要自己手动实现。但是在小程序中不需要这样的实现,所以bottom:0px就能够将组件定位于tabbar上面。...原创 2019-03-10 14:15:19 · 1270 阅读 · 0 评论 -
微信小程序 - bindtap不起作用
检查了半天程序,硬是没有Bug信息。吐槽小程序!日常吐槽!不想写小程序了!Solution在绑定tap事件的标签上检查是不是bind写错了!我无意间写成了bingtap,结果没有错误信息!继续吐槽!...原创 2019-03-10 17:07:40 · 10005 阅读 · 7 评论 -
微信小程序 - 监听globalData
参考文章: https://www.cnblogs.com/BestMePeng/p/xcx_watch_globaldata.html前言由于项目上线在即,发现了项目设计上的缺陷。项目的所有公用数据都存放在globalData中,想据此实现一个类似Vuex的状态管理程序。由于小程序的页面渲染需要手动触发,因此可以考虑实现一个对globalData的监听程序。代码在app.js中watc...原创 2019-03-10 19:24:30 · 4624 阅读 · 5 评论 -
微信小程序 - tabBar 文字颜色不支持rgb
Bug在调试阶段,使用rgb定义tabBar选中时的文字颜色,开发工具预览效果没错,不过在真机上调试发现出现问题。原本应该是黄色的文字,在真机上却变成了绿色。Solution将RGB 转换成hex 16进制...原创 2019-03-07 15:56:20 · 2744 阅读 · 0 评论 -
微信小程序:封装wx.request方法
//baseUrl -> prefixconst fetch = (options, callback, fail) => { let defaultOptions = { url: baseUrl, method: 'GET', data: null, success(data) { if (data.statusCode === 2...原创 2019-03-07 19:39:04 · 239 阅读 · 0 评论 -
微信小程序 - 监听page中的data
在app.js中 observe(obj, key, fun, caller){ var val = obj[key]; Object.defineProperty(obj, key, { configurable: true, enumerable: true, set(value) { console.log('set '...原创 2019-03-11 15:40:22 · 4561 阅读 · 0 评论 -
开发微信小程序总结
关于这次的小程序项目,有以下一些内容需要总结一下。开发方式开发文档调试方式开发方式由于微信小程序实际上是运行在微信App内部的,因此和通常我们所说的前端开发有点不同。(其实我并不想将小程序归于web前端这个领域中来,因为小程序被微信限制的太死了)IDE是微信自身提供的微信开发工具,我们可以利用这个IDE快速搭建项目。当然为了部署到线上,在此之前需要在微信开发后配注册小程序拿到相应的A...原创 2019-03-22 10:43:15 · 240 阅读 · 0 评论