微信-小程序入门与实战|

这门课解决的核心问题是：快速掌握微信生态下小程序的前端开发范式，并具备从页面搭建、数据交互到组件复用的完整工程能力。在当前跨端开发需求激增的背景下，开发者常面临微信原生API与主流框架差异大、组件复用率低等痛点。本课通过结构化拆解，将零散的API与UI知识转化为可落地的工程模块，帮助开发者摆脱对特定UI库的依赖，构建原生体验的小程序应用。

适合什么基础

适合具备前端基础（HTML/CSS/JavaScript及DOM操作）的开发者。建议优先观看“初识小程序”与“基本目录结构”，再进入“rpx响应式单位与flex布局”。前两块是理解小程序双线程模型与项目组织的前提，而flex与rpx则是后续实现响应式UI和组件布局的基石，跳过会导致后续页面开发频繁返工。

建议先看哪几块

建议按“基础认知→布局能力→数据交互→组件复用→实战项目”的顺序学习。先理解小程序双线程模型与目录结构，再掌握rpx与flex布局，接着学习条件渲染、列表渲染、异步API与缓存机制，随后深入自定义组件的独立性与自定义事件，最后以“电影详情与滑动加载”和“音乐播放”等实战项目收尾。实战项目能直接检验前四块知识的应用，是形成工程思维的关键。

学完能独立做什么

学完能独立完成一个完整的小程序应用，包括页面路由与事件处理、响应式布局、数据绑定与异步加载、下拉刷新与上拉加载等常见交互。通过自定义组件实现页面与组件的解耦，复用已有UI模块，最终能独立构建类似电影搜索、音乐播放等具备真实业务逻辑的应用。

资料怎么配合练习

建议边学边用代码。每个章节的源码文件可直接对照学习，理解目录结构与文件作用后，尝试修改rpx值观察布局变化，在阅读列表项目中操作setData绑定数据，在电影搜索项目中调试下拉与上拉加载逻辑。实战项目阶段，可参考课件中的组件拆分思路，独立实现一个带自定义事件的复用组件，将所学知识串联成完整的工程产出。

📁 微信-小程序入门与实战 📁 13-电影详情与滑动加载数据、下拉刷新数据 📁 09-音乐播放 📁 08-缓存机制与异步API的async和await 📁 02-小程序的基本目录结构与文件作用剖析 📁 06-路由函数与事件冒泡 📁 03-rpx响应式单位与flex布局 📁 07-构建阅读详情页面 📁 课件 📁 01-初识微信小程序 📁 05-条件渲染、列表渲染与小程序事件 📁 04-阅读列表与setData数据绑定 📁 12-电影列表与电影搜索 📁 11-电影页面与实战自定义组件 📁 10-初识小程序的自定义组件 📄 13.01-上滑加载更多数据1-onReachBottom.mp4 📄 13.02-上滑加载更多数据2-showloading提示.mp4 📄 13.05-谈组件的独立性.mp4 📄 13.06-自定义组件的自定义事件产生.mp4 📄 13.17-多层Flex布局的嵌套应用.mp4 📄 13.07-获取自定义组件的detail参数.mp4 📄 13.16-处理影人信息.mp4 📄 13.04-配置标题与动态配置标题.mp4 📄 13.08-同时获取自定义属性和自定义组件的detail参数.mp4 📄 13.09-电影详情页面1-获取电影详情数据.mp4 📄 13.03-下拉刷新数据1.mp4 📄 13.11-电影详情页面3-头部元素浮动技巧.mp4 📄 13.15-电影简介部分的CSS构建.mp4 📄 13.13-电影详情页5-图片的多种mode模式.mp4 📄 13.14-数据预处理.mp4 📄 13.19-Scroll-View组件的应用与结束语.mp4 📄 13.18-调整影人信息的CSS细节.mp4 📄 13.10-电影详情页面2-顶部区域.mp4 📄 13.12-电影详情页面4-图片预览效果只做.mp4 📄 2.1-小程序页面的4种基本文件类型详解.mp4 📄 2.2-小程序的全局配置文件、全局样式表和应用程序级别js文件.mp4 📄 2.3-认识一下我们要开发的Flower项目.mp4 📄 8.10-同步文章缓存状态.mp4 📄 8.08-初始化收藏状态.mp4 📄 8.11-showToast接口的应用.mp4 📄 8.05-文章收藏1-分析思路.mp4 📄 8.15-showActionSheet的使用.mp4 📄 8.07-收藏未收藏的切换.mp4 📄 8.13-showToast更换成showModal.mp4 📄 8.14-showModal的回调函数与Promise.mp4 📄 8.02-在app.js中保存全局变量.mp4 📄 8.12-牢记setData对于data属性的影响.mp4 📄 8.01-app.js的意义和作用.mp4 📄 8.09-缓存如何不被覆盖.mp4 📄 8.04-异步函数的几个方案：回调函数、promise与await.mp4 📄 8.03-小程序缓存的增删改查与清除.mp4 📄 8.06-文章收藏2-JS的动态属性.mp4 📄 9.04-切换音乐播放图标的两种方案：条件渲染与js表达式.mp4 📄 9.10-分析一个不是问题的问题.mp4 📄 9.03-小试音乐播放API.mp4 📄 9.08-音乐控制面板的暂停与停止逻辑.mp4 📄 9.01-浮动居中方案-通过left和top定位音乐图标.mp4 📄 9.06-背景音乐的监听相关API.mp4 📄 9.09-全局变量解决音乐播放状态初始化不正确的问题.mp4 📄 9.05-音乐播放状态切换.mp4 📄 9.11-让每篇文章音乐独立显示状态.mp4 📄 9.07-同步音乐总控开关与自有播放开光的状态.mp4 📄 9.02-小程序音乐播放API介绍.mp4 📄 V3-2020-master.zip 📄 6.2-Catch与Bind事件的区别.mp4 📄 6.4-用列表渲染展示导入的数组数据.mp4 📄 6.5-从列表页面跳转到文章详情页面.mp4 📄 6.3-js模块的导入导出（require与import）.mp4 📄 6.6-列表渲染的wxkey赋值规则.mp4 📄 6.1-路由函数NavigateTo和RedirectTo的区别.mp4 📄 6.7-事件冒泡的具体应用.mp4 📄 3.1-JSON对象与JS对象的区别（重点）.mp4 📄 3.9-聊聊小程序的方便性与灵活性的悖论.mp4 📄 3.2-新建页面的技巧与规则.mp4 📄 3.3-image标签显示一张图片.mp4 📄 3.5-分离CSS样式到WXSS文件中.mp4 📄 3.7-flex布局的align-items.mp4 📄 3.4-小程序rpx响应式单位的特点（非常重要）.mp4 📄 3.6-初识flex布局进行垂直分布布局.mp4 📄 3.8-自己编写一个Button组件.mp4 📄 7.11-为什么只传post-id.mp4 📄 7.02-构建文章详情页面2.mp4 📄 7.01-构建文章详情页面1.mp4 📄 7.06-Flex的高级应用3.mp4 📄 7.08-自定义属性data-的命名规则.mp4 📄 7.03-构建文章详情页面3.mp4 📄 7.10-加载详情数据并填充页面.mp4 📄 7.04-Flex的高级应用1.mp4 📄 7.07-组件的自定义属性data.mp4 📄 7.05-Flex的高级应用2-主轴和交叉轴.mp4 📄 7.09-在页面的onLoad函数中获取查询参数.mp4 📄 12.02-更多电影1-分析更多电影页面的逻辑.mp4 📄 12.09-搜索结果与电影数据的切换显示.mp4 📄 12.04-更多电影3-Flex-Wrap的应用.mp4 📄 12.05-更多电影4-Flex布局对于普通样式类的影响.mp4 📄 12.03-更多电影2-加载更多数据.mp4 📄 12.06-更多电影5-加载不同类型的电影数据.mp4 📄 12.01-wx.request的更多参数讲解.mp4 📄 12.07-使用LinUI快速构建搜索栏.mp4 📄 12.11-修复Space-Between2个元素两端分布的问题.mp4 📄 12.08-向服务器请求搜索数据.mp4 📄 12.10-显示搜索的电影数据.mp4 📄 1.2-下载小程序开发工具.mp4 📄 1.5-新版小程序开发工具的一些基本设置.mp4 📄 1.4-小程序appid的注册.mp4 📄 1.6-小程序的基本单位-Page页面.mp4 📄 1.3-新建小程序项目.mp4 📄 1.1-微信小程序全新版重录说明.mp4 📄 4.11-Swiper组件的其他重要属性设置.mp4 📄 4.07-Swiper组件1-通过插槽设置轮播内容.mp4 📄 4.02-安装、编译LinUI.mp4 📄 4.12-用Flex布局组织布局思路1.mp4 📄 4.14-用Flex布局组织布局思路3.mp4 📄 4.15-用Flex布局组织布局思路4.mp4 📄 4.01-LinUI组件库介绍.mp4 📄 4.06-初步了解Swiper和Swiper-Item组件.mp4 📄 4.13-用Flex布局组织布局思路2.mp4 📄 4.16-用Flex布局组织布局思路5.mp4 📄 4.09-属性设置一定要注意字符串以JS表达式的区别（重要）.mp4 📄 4.04-avatar头像和昵称组件.mp4 📄 4.10-布尔属性值赋值的良好建议.mp4 📄 4.05-添加新的编译模式.mp4 📄 4.08-Swiper组件2-Swiper组件内容的高宽设置技巧.mp4 📄 4.03-如何使用自定义组件.mp4 📄 5.01-使用LinUI的Icon组件代替图片ICON.mp4 📄 5.03-小程序开发数据的流向（1）.mp4 📄 5.09-小程序的生命周期函数与特殊回调函数.mp4 📄 5.10-数据绑定的实战应用.mp4 📄 5.11-Mustache语法解析.mp4 📄 5.02-LinUIIcon组件的颜色和大小设置.mp4 📄 5.14-列表渲染（下）.mp4 📄 5.04-单向数据绑定与双向数据绑定.mp4 📄 5.12-条件渲染.mp4 📄 5.08-预先在data中定义绑定数据的初始值是值得推荐的做法.mp4 📄 5.15-什么是事件.mp4 📄 5.07-理解Page.data与this.SetData的关系.mp4 📄 5.06-DOM优先VS数据优先.mp4 📄 5.13-列表渲染（上）.mp4 📄 5.05-数据绑定与setData函数（1）.mp4 📄 5.16-bind来捕捉事件执行回调函数.mp4 📄 11.01-Movie自定义组件的构建.mp4 📄 11.09-使用ES6箭头函数解决this指代的问题.mp4 📄 11.11-绑定服务端电影数据2.mp4 📄 11.02-使用LinUI的评分组件快速实现分数预览.mp4 📄 11.03-简易评分组件的实现思路(选看).mp4 📄 11.08-从服务器加载数据分页数据并传入自定义组件.mp4 📄 11.04-巧用Flex布局的Space-Between进行分布排列.mp4 📄 11.07-小试牛刀访问服务端数据.mp4 📄 11.05-调整自定义组件间距.mp4 📄 11.06-外部样式类externalClasses的使用.mp4 📄 11.10-绑定电影数据1-两种不同的评分方式.mp4 📄 11.12-完成即将上映和top250.mp4 📄 10.01-文章列表顶部轮播图跳转.mp4 📄 10.05-初识自定义组件.mp4 📄 10.04-跳转到带有选项卡的页面需要使用switchTab.mp4 📄 10.03-小程序tabBar的其他配置选项.mp4 📄 10.07-创建自定义组件的属性.mp4 📄 10.02-小程序tabBar选项卡配置基础.mp4 📄 10.09-自定义属性可以接收一个Object对象.mp4 📄 10.11-自定义组件的嵌套引用.mp4 📄 10.10-分离文章到单独的自定义组件中.mp4 📄 10.08-自定义组件属性的简化定义.mp4 📄 10.06-新建第一个自定义组件.mp4