微信小程序

2020-09-05 · 阅读 7893 · 字数 423

有时候需要通过微信小程序 button 设置 open type 来获取用户的信息。这时候就不能用 view 来实现，必须使用 button。 但是 button 默认带了样式，需要将默认样式清除掉。 可以在定义一个 reset_btn 的样式来重置 button 的样式。 代码示例 .reset_btn { margin:0; padding:0; border-radius:0; border:none; font-size:1em; background-color:transparent; } .reset_btn::after{ border: none; } 若 ...

阅读全文...

2020-08-11 · 阅读 4207 · 字数 133

由于历史数据迁移的问题，后台一些图片链接失效，或者无效。在微信小程序中，无效的图片链接会显示空白，非常影响体验。 此时，可以使用 image 组件的 binderror 来处理，替换为一张默认图片。 binderror 使用示例 wxml 模板中不要忘了加上 data index 来传递下标 <image wx:for="{{avatars}}" wx:for-index="index" wx:for-item="avatar" src="{{avatar}}" binderr ...

阅读全文...

2020-08-09 · 阅读 2543 · 字数 188

例如，我在微信小程序首页点击选择城市按钮，跳转到新目录页面进行城市选择，然后返回首页。 这里就涉及到一个问题，选择了城市之后，怎么把选择结果返回给上一页。 getCurrentPages getCurrentPages() 获取当前页面栈。数组中第一个元素为首页，最后一个元素为当前页面。 详细文档参考： https://developers.weixin.qq.com/miniprogram/dev/reference/api/getCurrentPages.html 代码示例 goBack: function(data) { let pages = getCurrentPages(); ...

阅读全文...

2020-08-08 · 阅读 8667 · 字数 405

我习惯用 rem 来设置小程序界面中的字体大小。但是默认的 16px 字号，在文字偏多的界面中，显得有点大。如果需要修改默认的 root font size，可以使用微信小程序的 page meta 中的 root-font-size 来设置。 参考官方文档： https://developers.weixin.qq.com/miniprogram/dev/component/page-meta.html root-font-size: 页面的根字体大小，页面中的所有 rem 单位，将使用这个字体大小作为参考值，即 1rem 等于这个字体大小；自小程序版本 2.11.0 起，也可以设置为 s ...

阅读全文...

2020-08-07 · 阅读 6381 · 字数 424

需求场景 在小程序页面展示时，对时间、金额进行格式化处理。但是每次在 js 文件中处理，并 setData 感觉无比麻烦。是否可以直接在 wxml 模板文件中进行处理。正好发现了微信小程序 wxs，完全满足需求。 微信小程序 wxs 使用场景 WXS（WeiXin Script）是微信创造的一套脚本语言，虽然看起来很 JS 异常相似，但是官方说法是： “WXS 与 JavaScript 是不同的语言，有自己的语法，并不和 JavaScript 一致”。 作为模板变量filter不错，随模板打包带走挺好用 WXS 特点： 在视图层（webview）中运行的 JS 可以监听 touch 事件 ...

阅读全文...

2020-08-06 · 阅读 5122 · 字数 214

在小程序里做打卡记录功能时，发现了一个不错的日历组件： https://github.com/treadpit/wx_calendar 虽然很好用，效果也不错。但是文档有点简单，好多细节没有覆盖到。这里记录一下。 cannot read property 'setDateStyle' of undefined 偶发性错误。大概三分之一的概率会出现。 在小程序页面 onShow 里的 http 回调中，执行 this.calendar.setDateStyle(toSet); 报错。 cannot read property 'setDateStyle' of undefined 问题原因 ...

阅读全文...

2020-08-06 · 阅读 5127 · 字数 265

WeUI 小程序组件库的左滑删除组件 slideview 非常适合对条目进行编辑、删除操作。 使用文档 https://developers.weixin.qq.com/miniprogram/dev/extended/weui/slideview.html 但是在点击按钮之后，如何知道具体是哪行数据被点击了呢？ 需要用到按钮组配置 buttons 设置，但是不能按照官方文档中的写死的做法，需要针对每一行数据做定制的 buttons 配置。 具体参数配置方法： WXML <mp-slideview buttons="{{item.btns}}" bindbuttont ...

阅读全文...

2020-08-04 · 阅读 4209 · 字数 342

为了方便用户在小程序页面中一目了然的知道自己当前位置，需要将获取到的经纬度转换成可读的位置描述。例如：烟台市开发区万科城。 位置信息 API 选型 高德地图接口 https://lbs.amap.com/api/webservice/guide/api/georegeo/ 腾讯地图 https://lbs.qq.com/miniProgram/jsSdk/jsSdkGuide/jsSdkOverview API 接口调用配额 腾讯地图个人版每天1万次；企业版未知 高德地图企业版 300 万次/天 高德地图 API 示例 wx.getLocation({ type: 'gcj02 ...

阅读全文...

2020-08-01 · 阅读 4029 · 字数 193

开发微信小程序的过程中，如果页面较多，例如四五十个页面，那么重复用到的样式会很多。把反复用到的样式抽象出来，放到全局样式文件中，可以大大提高写界面的效率。 全局样式文件 例如，根目录下的 app.wxss 中是否可以定义全局的字号，及颜色。 例如，h1, h2 等。 测试了一下，确实可以。 全局样式：app.wxss 是全局样式，作用于每一个页面。 单页样式：每一个page目录下的wxss文件只作用于当前页面；且会覆盖全局样式。 哪些样式适合放到全局 常用字号、颜色规范 常用样式：卡片、对齐等 ...

阅读全文...

2020-07-31 · 阅读 6397 · 字数 323

背景 在获取与地理位置相关的数据时，需要传递用户当前位置的坐标。 api https://developers.weixin.qq.com/miniprogram/dev/api/location/wx.getLocation.html 使用微信小程序位置 API 的注意事项 wx.getLocation 需要授权 scope.userLocation，并且必须在 app.json 中配置地理位置用途说明。例如， "permission": { "scope.userLocation": { "desc": &qu ...

阅读全文...

2020-07-25 · 阅读 6156 · 字数 674

上周发布的微信小程序“报名人数统计”用户量终于突破了 1000 人，于是在小程序后台开通了流量主广告。但是，广告管理后台提示要先通过合规性审核才能显示广告。找了半天没找到提交合规性审核的入口在哪里。 如何提交合规性审核 实际上是自动触发的，并不需要手动提交审核。 广告组件是在代码通过审核后点击发布版本才会触发审核的。所以，只需要加上广告代码，然后按照正常的提交审核流程提交审核就行了。审核通过，点击发布，就会自动进入广告组件审核中状态。还会收到一条推送的微信消息提醒。 此时，在小程序后台查看状态，就可以看到处于审核中状态了。 小程序广告审核多久 官方宣称，广告组件审核为一个工作日（不包括节假 ...

阅读全文...

2020-07-20 · 阅读 5094 · 字数 290

在平时使用手机微信时，大家经常会有预约人数统计的需求，例如： 暑期辅导课程预约报名 美容院免费体验套餐预约报名 火锅店等餐饮门店预约占座等 果农自种水果预订，例如，预订烟台大苹果 之前大家都是编写信息发送到微信群里，然后等待目标客户私聊，或者群聊，再手动记录，异常繁琐。 现在，使用微信小程序 “报名人数统计” ，就能很好的解决这个问题，显著提高预约报名的统计效率。不但可以让客户规范地填写姓名和电话，还能查看浏览量，了解推广的效果如何。而且可以选择不公开统计信息，只有创建者可以查看客户的联系方式，保护隐私数据。同时避免了群聊造成的客户信息泄露。 真实场景举例 创建一个报名活动，填写活动名称 ...

阅读全文...

2020-07-25 · 阅读 2898 · 字数 334

在微信小程序的一些统计页面，例如，查看用户量、浏览量等运营数据，很多时候，我希望能够不时地刷新一下，看看数据有没有变动。所以，比较好的体验是，在页面内提供下拉刷新功能。 page json 设置 增加配置项 "enablePullDownRefresh": true 用于开启当前页面下拉刷新功能支持。默认是 false。 参考： https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/page.html#%E9%85%8D%E7%BD%AE%E9%A1%B9 onPullDownRe ...

阅读全文...

2020-07-13 · 阅读 4399 · 字数 252

周末开发并提交审核成功的报名人数统计小程序 在周一连续审核失败。 审核失败原因 存在个人主体小程序未开放的服务类目，违反《微信小程序平台运营规范常见拒绝情形2.1》 详情描述 小程序页面内容涉及信息发布平台功能，属于个人主体类型未开放类目，建议申请企业主体类型小程序。 高昂的迁移费用 “小程序迁移”需支付审核服务费用人民币300元，该费用为用户基于腾讯公司提供的“小程序迁移”审核服务而支付给第三方专业审核机构的审核服务费用。一旦你确认提交小程序迁移申请，迁移流程随即开始，并产生审核服务相关成本、费用。无论小程序迁移申请的审核结果如何，所有费用不支持退款。 完全是霸王条款，我理解不了一个 ...

阅读全文...

2020-07-11 · 阅读 3172 · 字数 477

最近微信小程序再次开放了一个强悍的能力，支持分享朋友圈。这无疑是一个巨大的流量入口。所以，我立即在新开发的小程序上做了尝试。 配置方法 在 page js 文件中，类似于分享微信群的 onShareAppMessage 设置，增加一个 onShareTimeline 回调函数即可。 例如，我这周上线的一个统计人数小程序，增加了分享微信朋友圈的功能。这里，自定义了分享朋友圈的标题，即统计活动的名称。 /** * 用户点击右上角分享 */ onShareAppMessage: function () { return { title: this.data.activity.name ...

阅读全文...