🌹欢迎来到《小5讲堂》🌹
🌹这是《小程序》系列文章，每篇文章将以博主理解的角度展开讲解。🌹
🌹温馨提示：博主能力有限，理解水平有限，若有不对之处望指正！🌹
前言
隔一段时间没有接触微信小程序，好多功能就容易忘记，今天在做分享带参数并后端接收参数的功能测试，发现后端一直拿不到参数值。在小程序端打印日志发现也是空值，然后导出搜索了一遍没找到解决方案，以为是官方禁用了，最后是通过发布体验方式来测试获得了参数值。
模拟参数测试
没什么经验，还在想怎么本次测试带参数的情况，后来琢磨了下，微信开发者工具应该会提供测试的场景，果然是有的，比如下面的截图。
博主之前做过生成带有参数的小程序二维码，也是可以通过这方式来测试。
从下图可以知道，是支持带上多个参数
name=vendor&color=black
添加带有参数编译模式
比如博主这里设置了一个id=2的参数，确定后就会带上参数进行编译，如果要恢复原来的编译模式，直接点击删除该模式即可。
下图就是打印整个options参数，并且参数是放在query这个参数下
分享给朋友
第一是直接通过开发者预览方式转发给另一个微信号来点击测试，在手机打开调试模式，发现无法打印出来地址参数。
最后是通过提交生成体验二维码的方式打印出来了地址参数，有可能是分享给的微信号只有体验权限没有开发者权限的原因，如果有小伙伴也是遇到这种情况，那么就可以试下发给含有体验权限的好友号里测试。
/**
* 用户点击右上角分享
*/
onShareAppMessage() {
const path = '/pages/home/home?id=123';
console.log('分享路径:', path);
return {
title: '分享标题',
path: path
}
},
分享到朋友圈
官方地址：https://developers.weixin.qq.com/miniprogram/dev/wxcloudservice/wxcloud/guide/practice/appshare.html
在朋友圈点开的小程序预览界面是默认单页模式，此时只会显示默认静态内容，不会加载接口和互动内容，所以需要开发者根据1154场景进行静态内容显示，提示用户点击《前往小程序》进行体验。
并且分享到朋友圈的参数和分享给朋友设置的参数还点不同，需要给query参数赋值，否则无效，博主亲测有效。
/*
分享朋友圈
*/
onShareTimeline(){
return {
title: title,
query: 'id='+id
}
},
开发小技巧
基础优化技巧
合理使用setData
- 避免频繁调用setData，合并数据更新
- 只更新必要的数据字段，不要传递大量无关数据
- 对于大数据列表，使用局部更新而非全量更新
页面生命周期优化
- 在onLoad中完成必要数据初始化
- 在onShow中处理需要频繁更新的逻辑
- 在onHide中清理定时器或暂停耗性能的操作
WXML优化
- 减少不必要的节点嵌套
- 使用block标签作为逻辑包裹容器
- 合理使用hidden和wx:if
- hidden适用于频繁切换显示/隐藏
- wx:if适用于初始渲染时条件判断
性能提升技巧
图片优化
- 使用合适的图片格式(WebP在小程序中支持良好)
- 按需加载图片，使用懒加载技术
- 适当压缩图片，控制图片尺寸
列表渲染优化
- 长列表使用wx:for的优化属性
<view wx:for="{{list}}" wx:key="id" wx:for-item="item" wx:for-index="index">- 考虑使用recycle-view等组件处理超长列表
减少不必要的全局样式
- 避免在app.wxss中定义过多全局样式
- 使用页面或组件级别的样式
开发效率技巧
组件化开发
- 合理拆分组件，提高复用性
- 使用behaviors共享组件逻辑
- 善用slot插槽增加组件灵活性
自定义tabBar
- 通过自定义组件实现个性化tabBar
- 注意处理iPhoneX等全面屏设备的底部安全区域
调试技巧
- 使用
console.time()和console.timeEnd()测量代码执行时间 - 善用小程序开发者工具的调试面板
- 使用真机调试功能测试实际表现
- 使用
高级技巧
数据预加载
- 在页面跳转前预加载数据
- 使用getCurrentPages()获取页面栈进行跨页面通信
动画优化
- 使用CSS动画替代JS动画
- 合理使用transform和opacity属性实现高性能动画
- 考虑使用WXS响应事件提升交互性能
分包加载
- 合理规划分包，主包控制在2MB以内
- 按需加载分包，提升首屏加载速度
- 使用独立分包优化关键路径
云开发技巧
- 合理设计数据库索引
- 使用云函数处理复杂逻辑
- 利用云存储托管静态资源
常见问题解决
解决页面栈限制
- 使用redirectTo替代navigateTo避免页面栈过深
- 合理设计页面跳转逻辑
解决setData数据过大
- 分片加载大数据
- 使用虚拟列表技术
解决自定义组件样式隔离
- 使用
options: { styleIsolation: 'shared' }共享样式 - 合理使用外部样式类
- 使用
推荐文章
【小程序】微信小程序开发，分享给朋友或者朋友圈的功能增加地址参数，以及如何进行带参数本地测试
【小程序】.net core2.1对接微信支付开发时自己挖的坑
【前端】微信小程序，同名图片缓存问题，增加图片后缀动态参数值解决
【腾讯云】AI驱动TDSQL-C Serveress 数据库技术实战营-如何是从0到1体验电商可视化分析小助手得统计功能，一句话就能输出目标统计图
【随笔】博客质量分计算，如何让自己的博客脱颖而出，也许文章能够给你答案
【Sql Server】sql server 2019设置远程访问，外网服务器需要设置好安全组入方向规则