微信小程序开发学习文档（2026汇总版）

微信小程序开发学习文档（2026汇总版）

一、前期准备与全局认知

链接：微信小程序开发学习文档（一）_微信公众号通过h5嵌入的页面怎样下载文件-CSDN博客

1.1小程序生态与定位

• 1.1.1 小程序核心特点：即用即走、轻量高效、生态闭环

• 1.1.2 与公众号、H5、原生 App、快应用的全方位对比

• 1.1.3 2024-2026 年小程序发展趋势与新特性概览

• 1.1.4 主流应用场景与商业模式分析

1.2账号体系与资质管理

• 1.2.1 完整注册流程与 AppID 获取

• 1.2.2 个人、企业、政府、媒体主体权限详细对比

• 1.2.3 类目选择与资质要求（2026 最新版）

• 1.2.4 成员管理与权限分配

1.3开发环境搭建

• 1.3.1 微信开发者工具安装与版本选择（稳定版 / 测试版 /nightly 版）

• 1.3.2 开发者工具三大核心区域详解：编辑器、调试器、模拟器

• 1.3.3 真机调试与远程调试配置

• 1.3.4 第三方编辑器集成：VS Code + 小程序插件

• 1.3.5 开发环境常见问题与解决方案

二、项目架构与全局配置

链接：微信小程序开发学习文档（二）-CSDN博客

2.1官方推荐文件结构规范

• 2.1.1 全局文件详解：app.js、app.json、app.wxss、sitemap.json

• 2.1.2 页面文件四件套：.wxml、.wxss、.js、.json

• 2.1.3 目录结构最佳实践：按功能模块 vs 按文件类型

• 2.1.4 资源文件管理规范

2.2全局配置app.json

• 2.2.1pages数组：页面路径管理与首页设置

• 2.2.2window配置：导航栏、状态栏、背景色、下拉刷新

• 2.2.3tabBar配置：底部 / 顶部标签栏完整参数

• 2.2.4permission权限声明（2026 新增权限项）

• 2.2.5requiredBackgroundModes后台运行权限

• 2.2.6networkTimeout网络超时统一配置

• 2.2.7darkmode深色模式适配

2.3页面配置*.json

• 2.3.1 页面配置与全局配置的覆盖规则

• 2.3.2 单页面个性化导航栏设置

• 2.3.3 下拉刷新与上拉加载配置

• 2.3.4 页面滚动与全屏显示设置

三、视图层WXML与WXSS

链接：微信小程序开发学习文档（三）-CSDN博客

3.1 WXML模板语法基础

• 3.1.1 数据绑定{{}}：单向绑定原理与限制

• 3.1.2 条件渲染：wx:ifvshidden性能对比与使用场景

• 3.1.3 列表渲染：wx:for、wx:key的重要性与最佳实践

• 3.1.4 块级元素block的使用

3.2 WXML高级语法

• 3.2.1 模板template定义与引用

• 3.2.2 文件引用：importvsinclude区别与注意事项

• 3.2.3 2025 新增语法：wx:elif链式条件、wx:for嵌套优化

3.3 WXSS样式体系

• 3.3.1 尺寸单位rpx原理与多端适配方案

• 3.3.2 全局样式与局部样式优先级

• 3.3.3 支持的选择器与不支持的选择器

• 3.3.4 样式导入@import

• 3.3.5 内联样式与动态样式绑定

3.4布局技术

• 3.4.1 Flex 弹性布局：小程序首选布局方案

• 3.4.2 Grid 网格布局（2024 全面支持）

• 3.4.3 响应式布局与多设备适配

• 3.4.4 安全区域适配：safe-area-inset-*

四、逻辑层JavaScript核心

链接：微信小程序开发学习文档（四）-CSDN博客

4.1小程序运行环境与原理

• 4.1.1 双线程架构：逻辑层与视图层分离

• 4.1.2 通信机制与数据传输原理

• 4.1.3 运行时限制与注意事项

4.2全局应用实例App()

• 4.2.1 全局生命周期函数详解

• 4.2.2 全局数据globalData管理

• 4.2.3 全局错误监听与性能监控

4.3页面实例Page()

• 4.3.1 页面生命周期完整流程：onLoad→onShow→onReady→onHide→onUnload

• 4.3.2 特殊生命周期：onPullDownRefresh、onReachBottom、onShareAppMessage

• 4.3.3 页面数据data属性与响应式原理

• 4.3.4 自定义方法与事件处理函数

4.4数据驱动与setData

• 4.4.1setData工作原理与执行流程

• 4.4.2 同步更新与异步渲染问题

• 4.4.3 常见坑点：频繁调用、大量数据、深层嵌套

• 4.4.4 批量更新与优化技巧

4.5事件系统

• 4.5.1 事件分类：冒泡事件 vs 非冒泡事件

• 4.5.2 事件绑定：bindvscatchvsmut-bind

• 4.5.3 事件对象详解：targetvscurrentTarget

• 4.5.4 自定义数据传递：dataset使用

• 4.5.5 事件委托与性能优化

4.6模块化与代码复用

• 4.6.1 CommonJS 规范：module.exports与require

• 4.6.2 ES6 模块支持（2025 新增）

• 4.6.3 工具函数封装最佳实践

• 4.6.4 第三方 npm 包使用

五、页面路由与导航

链接：微信小程序开发文档（五）-CSDN博客

5.1页面栈原理

• 5.1.1 页面栈概念与层级限制（最多 10 层）

• 5.1.2 不同跳转方式对页面栈的影响

• 5.1.3 页面栈操作与管理

5.2导航方式详解

• 5.2.1wx.navigateTo：保留当前页面跳转

• 5.2.2wx.redirectTo：关闭当前页面跳转

• 5.2.3wx.switchTab：Tab 页面跳转

• 5.2.4wx.reLaunch：关闭所有页面跳转

• 5.2.5wx.navigateBack：返回上一页 / 多级

• 5.2.6navigator组件与 API 方式对比

5.3页面间通信

• 5.3.1 URL 参数传递：编码与解码

• 5.3.2 全局变量globalData

• 5.3.3 本地存储临时数据

• 5.3.4 事件总线实现跨页面通信

• 5.3.5getCurrentPages获取页面实例传值

六、内置组件体系

链接：微信小程序开发学习文档（六）-CSDN博客

6.1基础组件

• 6.1.1 容器组件：view、scroll-view、swiper、movable-view

• 6.1.2 基础内容：text、rich-text、progress

• 6.1.3 媒体组件：image（裁剪模式、懒加载）、video、audio、camera

6.2表单组件

• 6.2.1 输入类：input、textarea、picker、slider

• 6.2.2 选择类：checkbox、radio、switch

• 6.2.3 按钮与表单：button（open-type完整说明）、form

• 6.2.4 表单验证最佳实践

6.3导航与反馈组件

• 6.3.1navigator导航组件

• 6.3.2 消息提示：toast、loading、modal

• 6.3.3 操作菜单：action-sheet

6.4 2024-2026新增核心组件

• 6.4.1lottie动画组件

• 6.4.2map地图组件增强

• 6.4.3live-player与live-pusher直播组件

• 6.4.4canvas2.0 组件

七、微信原生API

链接：微信小程序开发学习文档（七）-CSDN博客

7.1网络请求

• 7.1.1wx.request完整参数与配置

• 7.1.2 合法域名配置与 HTTPS 要求

• 7.1.3 请求拦截与响应拦截封装

• 7.1.4wx.uploadFile文件上传

• 7.1.5wx.downloadFile文件下载

• 7.1.6 WebSocket 实时通信

7.2数据存储

• 7.2.1 本地存储 API：同步 vs 异步

• 7.2.2 存储容量限制与清理策略

• 7.2.3 数据加密存储

7.3界面交互

• 7.3.1 消息提示：showToast、showModal、showLoading

• 7.3.2 导航栏与 TabBar 操作

• 7.3.3 页面滚动控制

• 7.3.4 下拉刷新与上拉加载实现

7.4媒体与硬件能力

• 7.4.1 图片选择与处理：wx.chooseMedia（2024 统一 API）

• 7.4.2 录音与音频播放

• 7.4.3 扫码能力：wx.scanCode

• 7.4.4 位置服务：获取定位、地图展示

• 7.4.5 设备信息获取

7.5开放能力

• 7.5.1 登录流程：wx.login→后端→openid/unionid

• 7.5.2 用户信息获取：wx.getUserProfile（2026 最新规范）

• 7.5.3 微信支付完整流程

• 7.5.4 分享与转发：onShareAppMessage、onShareTimeline

• 7.5.5 订阅消息推送

八、自定义组件化开发

链接：微信小程序开发学习文档（八）-CSDN博客

8.1自定义组件基础

• 8.1.1 组件创建与目录结构

• 8.1.2Component()构造器完整参数

• 8.1.3 组件配置项：properties、data、methods

• 8.1.4 组件生命周期函数

8.2组件通信

• 8.2.1 父传子：properties属性传递

• 8.2.2 子传父：triggerEvent自定义事件

• 8.2.3 兄弟组件通信

• 8.2.4 跨组件通信：behaviors与全局事件

8.3组件高级特性

• 8.3.1 插槽slot：单插槽、多插槽、作用域插槽

• 8.3.2 组件样式隔离与共享

• 8.3.3 组件的behaviors复用机制

• 8.3.4 抽象节点与组件扩展

• 8.3.5 组件间关系：relations定义

8.4组件设计模式与最佳实践

• 8.4.1 无状态组件 vs 有状态组件

• 8.4.2 通用组件库设计原则

• 8.4.3 常见组件封装案例：弹窗、下拉刷新、无限列表

九、工程化与最佳实践

链接：微信小程序开发学习文档（九）-CSDN博客

9.1构建工具与工程化

• 9.1.1 原生小程序工程化痛点

• 9.1.2 主流框架对比：uni-app、Taro、mpvue（2026 现状）

• 9.1.3 微信官方工程化工具：WePY 3.0

• 9.1.4 TypeScript 在小程序中的应用

9.2代码规范与质量

• 9.2.1 ESLint+Prettier 代码检查与格式化

• 9.2.2 小程序特有的代码规范

• 9.2.3 Git 提交规范与版本管理

9.3调试与测试

• 9.3.1 开发者工具调试技巧：断点、日志、性能面板

• 9.3.2 真机调试与远程调试

• 9.3.3 单元测试：Jest 集成

• 9.3.4 端到端测试

9.4项目架构设计

• 9.4.1 MVC/MVVM 架构在小程序中的应用

• 9.4.2 状态管理：原生方案 vs 第三方库

• 9.4.3 请求层封装与统一错误处理

• 9.4.4 权限管理与路由守卫

十、性能优化与用户体验

链接：微信小程序开发学习文档（十）-CSDN博客

10.1启动性能优化

• 10.1.1 首屏加载时间分析

• 10.1.2 分包加载：主包、分包、独立分包

• 10.1.3 预加载与按需加载

• 10.1.4 骨架屏实现方案

10.2运行时性能优化

• 10.2.1setData优化策略

• 10.2.2 列表渲染优化：虚拟列表实现

• 10.2.3 图片优化：懒加载、压缩、WebP 格式

• 10.2.4 事件优化：防抖与节流

• 10.2.5 内存泄漏排查与避免

10.3用户体验提升

• 10.3.1 加载状态与空状态设计

• 10.3.2 错误处理与重试机制

• 10.3.3 手势操作与动画效果

• 10.3.4 深色模式与无障碍适配