更新日期:2021.12.17
课程简介:
1. 详尽的讲解了微信小程序的基础知识
2. 基于 uni-app 实现微信小程序项目的开发
3. 项目中会涉及到登录支付等微信小程序特有的能力
课程亮点:
1、本课程从小程序账号注册、开发环境搭建、基础语法、路由导航、数据请求、分包、组件化等方面详细阐述了小程序开发必备的基础知识。
2、学完小程序基础之后,利用 uni-app 技术实现微信小程序的开发,可以做到一次开发多端部署。
3、项目拥有首页、搜索页、商品列表页、商品详情页、购物车、登录支付等主要功能。涵盖了分包、vuex、组件化开发等核心技术点的使用。
适用人群:
1. 对小程序开发感兴趣的开发者。
2. 希望学习小程序提高行业竞争力的前端开发者。
3. 希望通过学习小程序完成业务开发的在职人员。
课程内容:
day01
小程序简介
注册小程序开发帐号
安装开发者工具
小程序代码的构成
小程序的宿主环境
协同工作和发布
day02
数据绑定
事件绑定
条件渲染
列表渲染
了解WXSS
rpx
样式导入
全局样式和局部样式
全局配置文件及常用的配置项
页面配置
网络数据请求
案例 - 本地生活(首页)
day03
页面导航
页面事件
生命周期
WXS 脚本
案例 - 本地生活(列表页面)
day04
自定组件
组件的创建与引用
样式
数据、方法和属性
数据监听器
数据监听器 - 案例
纯数据字段
组件的生命周期
组件所在页面的生命周期
插槽
父子组件之间的通信
behaviors
day05
使用 npm 包
全局数据共享
分包
案例 - 自定义 tabBar
day06
配置uni-app项目的开发环境
初始化uni-app的项目
配置tabBar效果
在uni-app项目中配置小程序分包
封装uni.$showMsg()方法
渲染首页分类导航区域的UI效果
渲染首页楼层区域的UI效果
day07
使用scroll-view组件实现分类页面的布局效果
在切换一级分类之后重置滚动条的位置
动态设置scroll-view组件的高度
在uni-app项目中自定义组件
实现首页中搜索组件吸顶的效果
为自定义的搜索组件封装click事件
实现搜索框防抖的处理
渲染搜索建议列表的UI结构
解决搜索关键词前后顺序的问题
解决搜索关键词重复的问题
将搜素历史记录持久化存储到本地
day08
将商品Item项封装为组件
使用过滤器处理商品价格
实现上拉加载更多
实现下拉刷新的功能
实现商品详情页的轮播图大图预览效果
使用rich-text渲染图文详情
实现商品导航区域的UI效果
在uni-app项目中使用vuex
实现加入购物车的功能
动态统计购物车中商品的总数量
为tabBar设置数字徽标
day09
为my-goods组件封装radio勾选状态
为my-goods组件封装NumberBox
实现购物车中商品滑动删除的功能
实现选择收货地址的功能
将收货地址信息存储到vuex中
解决重新授权的问题
day10
实现全选/反选的功能
计算已勾选商品的总价和数量
动态计算tabBar中购物车徽标的值
获取用户的基本信息
实现微信登录的功能
把Token存储都vuex中
实现用户信息组件
实现3秒倒计时跳转到登录页的功能
实现微信支付的功能
把uni-app项目发布为小程序
把uni-app项目发布为Android App
10人已评分
我也要评分
2023-09-14 13:05
11
02023-06-19 19:47
2023-05-11 15:08
2023-01-04 22:09
GET https://www.uinav.com/api/public/v1/home/swiperdata 502 (Bad Gateway)(env: Windows,mp,1.05.2204250; lib: 2
12022-09-11 15:50
2022-02-14 14:40
2022-02-12 11:15
2022-02-11 08:48
2021-12-18 19:06
2021-12-01 10:06