首页实战微信小程序入门与实战（全新版）超20000人学习的好课章节目录

微信小程序入门与实战-全新版

神课再迭代，历时4年，学员20000+，始终与微信官方同步，缔造高口碑的精品课程

￥149.00

已完结难度初级时长 21小时学习人数 23863 综合评分 9.99

立即购买加购物车

第1章全新版：初识微信小程序试看 6 节 | 35分钟

本章，我们初步了解什么是微信小程序。同时，我们会下载微信小程序工具、申请appid，并进行一些列开发的准备工作。

收起列表
- 视频： 1-1 微信小程序全新版重录说明 (04:55) 试看
- 视频： 1-2 下载小程序开发工具 (02:54) 试看
- 视频： 1-3 新建小程序项目 (08:04) 试看
- 视频： 1-4 小程序appid的注册 (01:49)
- 视频： 1-5 新版小程序开发工具的一些基本设置 (10:24)
- 视频： 1-6 小程序的基本单位-Page页面 (06:06)
第2章全新版：小程序的基本目录结构与文件作用剖析 3 节 | 25分钟

本章我们会了解小程序官方种子项目的目录结构，并介绍Page页面。同时我们还需要了解页面级别的文件和应用程序级别的文件有什么区别。

收起列表
- 视频： 2-1 小程序页面的4种基本文件类型详解 (09:39)
- 视频： 2-2 小程序的全局配置文件、全局样式表和应用程序级别js文件 (07:44)
- 视频： 2-3 认识一下我们要开发的Flower项目 (07:02)
第3章全新版：rpx响应式单位与flex布局 10 节 | 88分钟

本章我们通过制作第一个welcome欢迎页面来学习如何在小程序中做响应式。同时，我们需要学习非常重要的布局语法——flex布局。这是在小程序中用的最多也是最为好用的布局方案。

收起列表
- 视频： 3-1 JSON对象与JS对象的区别（重点） (06:13)
- 作业： 3-2 目的：充分学习Flex布局的技巧
- 视频： 3-3 新建页面的技巧与规则 (08:01)
- 视频： 3-4 image标签显示一张图片 (07:06)
- 视频： 3-5 小程序rpx响应式单位的特点（非常重要） (16:14)
- 视频： 3-6 分离CSS样式到WXSS文件中 (06:57)
- 视频： 3-7 初识flex布局进行垂直分布布局 (10:46)
- 视频： 3-8 flex布局的align-items (06:45)
- 视频： 3-9 自己编写一个Button组件 (07:34)
- 视频： 3-10 聊聊小程序的方便性与灵活性的悖论 (17:29)
第4章全新版：阅读列表与setData数据绑定 16 节 | 149分钟

本章我们通过编写新闻阅读页面来学习小程序的数据绑定的概念。同时，我们也会介绍LinUI组件库的用法。

收起列表
- 视频： 4-1 LinUI组件库介绍 (06:52)
- 视频： 4-2 安装、编译LinUI (12:01)
- 视频： 4-3 如何使用自定义组件 (13:05)
- 视频： 4-4 l-avatar头像和昵称组件 (09:22)
- 视频： 4-5 添加新的编译模式 (07:47)
- 视频： 4-6 初步了解Swiper和Swiper-Item组件 (08:29)
- 视频： 4-7 Swiper组件（1）通过插槽设置轮播内容 (08:49)
- 视频： 4-8 Swiper组件（2）Swiper组件内容的高宽设置技巧 (08:40)
- 视频： 4-9 属性设置一定要注意字符串以JS表达式的区别（重要） (12:26)
- 视频： 4-10 布尔属性值赋值的良好建议 (04:44)
- 视频： 4-11 Swiper组件的其他重要属性设置 (07:26)
- 视频： 4-12 用Flex布局组织布局思路（1） (09:37)
- 视频： 4-13 用Flex布局组织布局思路（2） (06:49)
- 视频： 4-14 用Flex布局组织布局思路（3） (10:30)
- 视频： 4-15 用Flex布局组织布局思路（4） (09:56)
- 视频： 4-16 用Flex布局组织布局思路（5） (12:10)
第5章全新版：条件渲染、列表渲染与小程序事件 17 节 | 156分钟

本章我们来学习wx:if与wx：for等渲染语法。同时我们需要了解小程序的事件处理机制。

收起列表
- 视频： 5-1 使用LinUI的Icon组件代替图片ICON (11:20)
- 视频： 5-2 LinUI Icon组件的颜色和大小设置 (08:18)
- 视频： 5-3 小程序开发数据的流向（1） (09:42)
- 视频： 5-4 单向数据绑定与双向数据绑定 (13:37)
- 视频： 5-5 数据绑定与setData函数（1） (12:03)
- 视频： 5-6 DOM优先 VS 数据优先 (08:26)
- 作业： 5-7 目的：提前了解ES6的常用语法
- 视频： 5-8 理解Page.data与this.SetData的关系 (08:33)
- 视频： 5-9 预先在data中定义绑定数据的初始值是值得推荐的做法 (06:20)
- 视频： 5-10 小程序的生命周期函数与特殊回调函数 (13:32)
- 视频： 5-11 数据绑定的实战应用 (07:59)
- 视频： 5-12 Mustache语法解析 (18:02)
- 视频： 5-13 条件渲染 (06:59)
- 视频： 5-14 列表渲染（上） (14:01)
- 视频： 5-15 列表渲染（下） (05:15)
- 视频： 5-16 什么是事件 (04:35)
- 视频： 5-17 bind来捕捉事件执行回调函数 (06:42)
第6章全新版：路由函数与事件冒泡 8 节 | 65分钟

本章我们将重点学习小程序的几个路由函数用于跳转页面，同时我们将学习小程序的事件冒泡机制。

收起列表
- 视频： 6-1 路由函数NavigateTo和RedirectTo的区别 (14:44)
- 作业： 6-2 目的：JS模块的概念与导入导出的方式
- 视频： 6-3 Catch与Bind事件的区别 (08:49)
- 视频： 6-4 js模块的导入导出（require与import）_1 (13:33)
- 视频： 6-5 用列表渲染展示导入的数组数据 (07:55)
- 视频： 6-6 从列表页面跳转到文章详情页面 (08:41)
- 视频： 6-7 列表渲染的wxkey赋值规则 (06:05)
- 视频： 6-8 事件冒泡的具体应用 (05:12)
第7章全新版：构建阅读详情页面 11 节 | 88分钟

本章我们主要构建新闻详情页面，同时介绍Flex的主轴和交叉轴、自定义属性data-等技术和知识

收起列表
- 视频： 7-1 构建文章详情页面（1） (07:32)
- 视频： 7-2 构建文章详情页面（2） (03:58)
- 视频： 7-3 构建文章详情页面（3） (09:13)
- 视频： 7-4 Flex的高级应用（1） (13:10)
- 视频： 7-5 Flex高级应用（2）主轴和交叉轴 (10:11)
- 视频： 7-6 Flex高级应用（3） (04:08)
- 视频： 7-7 组件的自定义属性data (07:27)
- 视频： 7-8 自定义属性data-的命名规则 (11:24)
- 视频： 7-9 在页面的onLoad函数中获取查询参数 (06:51)
- 视频： 7-10 加载详情数据并填充页面 (09:59)
- 视频： 7-11 为什么只传post-id (03:53)
第8章全新版：缓存机制与异步API的async和await 17 节 | 123分钟

本章我们通过制作文章收藏的功能，学习小程序的缓存机制与异步API的调用方案，同时我们将学习如何使用async和await来简化异步API的调用。

收起列表
- 视频： 8-1 app.js的意义和作用 (07:04)
- 作业： 8-2 目的：了解缓存的概念
- 视频： 8-3 在app.js中保存全局变量 (03:58)
- 作业： 8-4 目的：熟悉async和await的用法和意义
- 视频： 8-5 小程序缓存的增删改查与清除 (11:06)
- 视频： 8-6 异步函数的几个方案：回调函数、promise与await (13:44)
- 视频： 8-7 文章收藏（1）分析思路 (10:48)
- 视频： 8-8 文章收藏（2）JS的动态属性 (05:39)
- 视频： 8-9 收藏未收藏的切换 (05:23)
- 视频： 8-10 初始化收藏状态 (06:11)
- 视频： 8-11 缓存如何不被覆盖？ (07:41)
- 视频： 8-12 同步文章缓存状态 (06:59)
- 视频： 8-13 showToast接口的应用 (08:53)
- 视频： 8-14 牢记setData对于data属性的影响 (06:08)
- 视频： 8-15 showToast更换成showModal（1） (10:25)
- 视频： 8-16 showModal的回调函数与Promise (10:12)
- 视频： 8-17 showActionSheet的使用 (08:32)
第9章全新版：音乐播放 11 节 | 90分钟

本章我们将只做音乐播放功能，通过音乐播放我们重点学习如何编写复杂的业务逻辑，这对于大家的逻辑思维能力有很好的培养效果。

收起列表
- 视频： 9-1 浮动居中方案-通过left和top定位音乐图标 (12:23)
- 视频： 9-2 小程序音乐播放API介绍 (05:24)
- 视频： 9-3 小试音乐播放API (11:10)
- 视频： 9-4 切换音乐播放图标的两种方案：条件渲染与js表达式 (12:33)
- 视频： 9-5 音乐播放状态切换 (08:15)
- 视频： 9-6 背景音乐的监听相关API (04:56)
- 视频： 9-7 同步音乐总控开关与自有播放开光的状态 (09:46)
- 视频： 9-8 音乐控制面板的暂停与停止逻辑 (04:53)
- 视频： 9-9 全局变量解决音乐播放状态初始化不正确的问题 (07:11)
- 视频： 9-10 分析一个不是问题的问题 (03:52)
- 视频： 9-11 让每篇文章音乐独立显示状态 (08:43)
第10章全新版：初识小程序的自定义组件 11 节 | 80分钟

本章我们将学习如何开发类似LinUI一样的自定义组件。自定义组件对于小程序来说非常重要，一定要好好学习。同时我们将介绍小程序的tabBar配置方案。

收起列表
- 视频： 10-1 文章列表顶部轮播图跳转 (04:17)
- 视频： 10-2 小程序tabBar选项卡配置基础 (07:14)
- 视频： 10-3 小程序tabBar的其他配置选项 (09:29)
- 视频： 10-4 跳转到带有选项卡的页面需要使用switchTab (02:48)
- 视频： 10-5 初识自定义组件 (09:13)
- 视频： 10-6 新建第一个自定义组件 (07:12)
- 视频： 10-7 创建自定义组件的属性 (07:40)
- 视频： 10-8 自定义组件属性的简化定义 (05:06)
- 视频： 10-9 自定义属性可以接收一个Object对象 (06:12)
- 视频： 10-10 分离文章到单独的自定义组件中 (06:30)
- 视频： 10-11 自定义组件的嵌套引用 (13:58)
第11章全新版：电影页面与实战自定义组件 12 节 | 109分钟

我们将全部用组件化思维构建电影页面，在这个章节我们将学习什么是组件化思维，并深入了解自定义组件的机制。

收起列表
- 视频： 11-1 Movie自定义组件的构建 (09:27)
- 视频： 11-2 使用LinUI的评分组件快速实现分数预览 (11:53)
- 视频： 11-3 简易评分组件的实现思路（选看） (04:20)
- 视频： 11-4 巧用Flex布局的Space-Between进行分布排列 (08:41)
- 视频： 11-5 调整自定义组件间距 (07:04)
- 视频： 11-6 外部样式类externalClasses的使用 (13:22)
- 视频： 11-7 小试牛刀访问服务端数据 (08:34)
- 视频： 11-8 从服务器加载数据分页数据并传入自定义组件 (12:20)
- 视频： 11-9 使用ES6箭头函数解决this指代的问题 (08:26)
- 视频： 11-10 绑定电影数据（1）两种不同的评分方式 (06:55)
- 视频： 11-11 绑定服务端电影数据（2） (07:34)
- 视频： 11-12 完成即将上映和top250 (09:51)
第12章全新版：电影列表与电影搜索 11 节 | 88分钟

本章我们主要学习制作电影列表宫格页面与电影搜索功能。本章的重点在于小程序的布局技巧与前面知识的复习与练习

收起列表
- 视频： 12-1 wx.request的更多参数讲解 (05:59)
- 视频： 12-2 更多电影（1）分析更多电影页面的逻辑 (10:02)
- 视频： 12-3 更多电影（2）加载更多数据 (08:53)
- 视频： 12-4 更多电影（3）Flex-Wrap的应用 (08:33)
- 视频： 12-5 更多电影（4）Flex布局对于普通样式类的影响 (06:52)
- 视频： 12-6 更多电影（5）加载不同类型的电影数据 (08:43)
- 视频： 12-7 使用LinUI快速构建搜索栏 (07:52)
- 视频： 12-8 向服务器请求搜索数据 (09:45)
- 视频： 12-9 搜索结果与电影数据的切换显示 (07:56)
- 视频： 12-10 显示搜索的电影数据 (07:31)
- 视频： 12-11 修复Space-Between2个元素两端分布的问题 (05:31)
第13章全新版：电影详情与滑动加载数据、下拉刷新数据 19 节 | 192分钟

本章我们重点制作电影详情页面，电影详情页面比较复杂，元素和CSS都比较多。同学们需要重点学习CSS布局的一些技巧。同时我们还会介绍如何滑动加载更多分页数据、如何刷新数据。Flex布局的嵌套应用与Scroll-View组件的应用也需要认真学习...

收起列表
- 视频： 13-1 上滑加载更多数据（1）onReachBottom (12:16)
- 视频： 13-2 上滑加载更多数据（2）showloading提示 (06:15)
- 视频： 13-3 下拉刷新数据（1） (11:58)
- 视频： 13-4 配置标题与动态配置标题 (13:19)
- 视频： 13-5 谈组件的独立性 (06:52)
- 视频： 13-6 自定义组件的自定义事件产生 (09:27)
- 视频： 13-7 获取自定义组件的detail参数 (07:19)
- 视频： 13-8 同时获取自定义属性和自定义组件的detail参数 (12:17)
- 视频： 13-9 电影详情页面（1）获取电影详情数据 (07:45)
- 视频： 13-10 电影详情页面（2）顶部区域 (10:19)
- 视频： 13-11 电影详情页面（3）头部元素浮动技巧 (10:11)
- 视频： 13-12 电影详情页面（4）图片预览效果只做 (10:06)
- 视频： 13-13 电影详情页（5）图片的多种mode模式 (09:00)
- 视频： 13-14 数据预处理 (24:05)
- 视频： 13-15 电影简介部分的CSS构建 (08:54)
- 视频： 13-16 处理影人信息 (09:45)
- 视频： 13-17 多层Flex布局的嵌套应用 (07:53)
- 视频： 13-18 调整影人信息的CSS细节 (05:09)
- 视频： 13-19 Scroll-View组件的应用与结束语 (08:25)