薛定喵君的博客

借负责的小程序流量暴增事件总结下优化技巧 之前负责的锡慧在线小程序是一款公益性质在线教育类小程序，因疫情影响导致流量暴增，日访问过百万 高峰期每分钟1w+在线访问视频播放卡顿严重，使用体验很差。博主已是离职状态，但是公司内并没有找到可以接手的同学，小程序前端是我从零一手做出来的，有点特殊情感，于是就以小程序顾问的身份帮忙处理了小程序端的工作。 应对本次问题，视频卡顿是选择把视频课件资源从文件...

记录下如何为小程序评论组件添加内容安全检测功能 最近打算为之前做的小程序增加评论功能，提交审核被拒，理由是存在信息安全风险 于是就需要修改 WxComment 组件增加检测功能了。 修改方法如下： # 增加云函数 参照官方文档 增加内容检测云函数 const cloud = require('wx-server-sdk')cloud.init()exports.main = async (ev...

# wx:if 有更高的切换消耗 条件值切换，有一个局部渲染的过程，因为它会确保条件块在切换时销毁或重新渲染 惰性的，在隐藏的时候不渲染，如果在初始渲染条件为 false,则在条件第一次变成真的时候才开始局部渲染 适用场景：运行时条件不大可能改变 # hidden 更高的初始渲染消耗 组件始终会被渲染，在隐藏时仍然渲染，只是不呈现 只是简单的控制显示与隐藏 适用场景：需要频繁切换的情景 ::: t...

未启动时更新开发者在管理后台发布新版本的小程序之后，如果某个用户本地有小程序的历史版本，此时打开的可能还是旧版本。微信客户端会有若干个时机去检查本地缓存的小程序有没有更新版本，如果有则会静默更新到新版本。总的来说，开发者在后台发布新版本之后，无法立刻影响到所有现网用户，但最差情况下，也在发布之后 24 小时之内下发新版本信息到用户。用户下次打开时会先更新最新版本再打开 启动时更新小程序每次冷启...

记录下i-input组件在模拟器中不能输入值问题的原因及解决办法 最近开始用mpvue框架,所以遇到了一些坑,这篇文章记录下关于input组件的一个坑。老司机请略过。小程序里做一个登录页,输入手机号和密码进行登录。很简单吧,用了iview之后页面很快撸出来了，但是点击输入框敲打键盘之后发现无论输什么东西全部都输不进去，这尼玛什么情况。预览到手机上进行同样的输入竟然是可以的。 于是乎进行了一番搜索...

记录下mpvue框架下做数据编辑页时出现的bug处理方法 结合网上搜索到的一些处理方法在此重新整理一番 现象解决方法总结# 现象 步骤1.编辑页面输入数据2.点击左上角返回按钮3.再次进入编辑页面结果发现第1步输入的数据仍然显示在页面上，数据没有被清空 # 解决方法 # 编辑数据存在于非tab页的情况 网友的方法1.mounted时执行重置 mounted () { Object.as...

记一下vant的云开发示例实现 vant weapp的Area省市区选择业务组件提供了一个云开发示例但是没写详细的过程，这里把具体步骤说明一下。方便一下别的同学。 省市区数据获取数据导入云开发数据库小程序中使用效果示例Vant Weapp组件的说明省市区选择组件 实际项目中，可以通过小程序云开发的能力，将省市区数据保存在云开发的数据库中，并在小程序中使用云开发的接口异步获取数据。在小程序中使用...

在小程序模板消息下线的日子记一下订阅消息的使用 博主最近做的小程序涉及到余额提现的功能，需要在提现过程中推送给用户相应类型的消息。下面介绍下实现的流程。 获取模板ID订阅消息发送云函数添加获取下发权限下发订阅消息# 获取模板ID 本文涉及到的是提现功能相关消息模板在小程序管理后台订阅消息功能模块中添加如下模板 提现失败模板的详情 # 订阅消息发送云函数添加 # 参照前文mpvue框架下使用小程序...

记录下mpvue框架下进行云开发需要的配置 设置云函数根目录新增云函数使用云函数# 设置云函数根目录 /static目录下创建目录funtions在project.config.json文件下新增字段 "cloudfunctionRoot": "/static/functions/"编译后无效时请手动在dist下的project.config.json中添加云函数根目录设置 # 新增云函数 1....

记一下小程序分享朋友圈功能的实现 分享朋友圈很适合内容型小程序，所以就在博客小程序里加了这个功能(可能也用不到????) 基础库要求设置分享状态真机效果注意事项错误处理参考资料# 基础库要求 基础库需要2.11.3版本以上 目前仅支持安卓 # 设置分享状态 需同时允许两个设置 设置允许“发送给朋友”(shareAppMessage) 设置允许“分享到朋友圈”(shareTimeline) 注意：事件处理...

介绍如何为小程序快速接入评论系统 WxComment是一个微信小程序的评论插件，结合BaaS提供商LeanCloud，无需其他另外的个人或者云服务器，可以免费使用。 这里以科技爱好者周刊为例，介绍下如何使用WxComment插件为小程序添加评论功能。 # 账号准备 # LeanCloud 1.注册LeanCloud账号，创建LeanCloud应用；2.前往 LeanCloud 控制台 > ...

最近在学习mpvue,记一下苹果X安全区域的适配问题 判断机型工具类全局组件mixin安全距离css页面标签class类处理# 判断机型工具类 safe-area.js let cache = nullexport default function getSafeArea() { return new Promise((resolve, reject) => { if (cac...

云函数生成小程序码的Demo # 云函数 config.json配置,云调用wxacode.get API 的权限 { "permissions": { "openapi": [ "wxacode.get" ] }}index.js const cloud = require('wx-server-sdk')cloud.init()exports.ma...

记一个奇葩问题 最近做小程序碰到一个神奇的现象，页面上定义了一个按钮触发分享，另外一个同级view标签处理别的事件。但是点击view标签的时候却触发了分享操作。 wxml <view class="oprator flex"> <button class="share-box" open-type="share"> <image class="ic...

微信小程序image标签的mode属性介绍 值 说明 scaleToFill 缩放模式，不保持纵横比缩放图片，使图片的宽高完全拉伸至填满 image 元素 aspectFit 缩放模式，保持纵横比缩放图片，使图片的长边能完全显示出来。也就是说，可以完整地将图片显示出来。 aspectFill 缩放模式，保持纵横比缩放图片，只保证图片的短边能完全显示出来。也就是说，图片通常只在水平或垂直方向是完整的...

小程序适配iPhone刘海屏及indicator的方法 本文适用于未自定义导航&吸底按钮(底部按钮fixed)的情况 # 判断设备 判断方法->wx.getSystemInfo(OBJECT)返回的信息 model是否包含 iPhone X screenHeight是否等于 812 # 代码 主要js代码 //app.jsApp({ // 全局数据 globalData: ...

记下检测版本更新的代码 在App.vue中追加以下代码即可 onLaunch() { if (wx.canIUse('getUpdateManager')) { const updateManager = wx.getUpdateManager() updateManager.onCheckForUpdate(function (res) { if (res.has...

小程序里为了统一下单需要单独获取用户openID时报了一个错 {"errcode":40163,"errmsg":"code been used, hints: [ req_id: 1jjDQ0yFe-FfPmqa ]"}就是code已经被使用了,必须再wx.login()一下拿code才可以。临时登录凭证code只能使用一次,被别的微信接口使用之后就不能再用了需要重新获取。。 wx.login(...

做锡慧在线小程序课程详情页时需要在页面向下滚动的时候显示吸顶锚点菜单,记一下IntersectionObserver的用法 1.显示时机暂定为课程信息移出屏幕的时刻 2.代码如下:js this._observer = wx.createIntersectionObserver(this);this._observer.relativeTo('.jump-list').observe('.co...

获取当前页面栈的实例取最后一个元素 getCurrentPages() 函数用于获取当前页面栈的实例，以数组形式按栈的顺序给出，第一个元素为首页，最后一个元素为当前页面。 let pages = getCurrentPages();let currPage = null;if (pages.length) { currPage = pages[pages.length - 1];}...

# setData 频繁setData(毫秒级)后果 Android 下用户在滑动时会感觉到卡顿，操作反馈延迟严重，因为 JS 线程一直在编译执行渲染，未能及时将用户操作事件传递到逻辑层，逻辑层亦无法及时将操作处理结果及时传递到视图层 渲染有出现延时，由于 WebView 的 JS 线程一直处于忙碌状态，逻辑层到页面层的通信耗时上升，视图层收到的数据消息时距离发出时间已经过去了几百毫秒，渲染的结果...