微信小程序实战教程-3：京西购物商城实战之Home页实现

文章目录

• 3、首页
• • 3.0 创建home分支
  • 3.1 配置网络请求
  • 3.2 轮播图区域
  • • 3.2.1 请求轮播图的数据
    • 3.2.2 渲染轮播图的UI结构
    • 3.2.3 配置小程序分包
    • 3.2.4 点击轮播图跳转到商品详情页
    • 3.2.5 封装 uni.$showMsg() 方法
  • 3.3 分类导航区域
  • • 3.3.1 获取分类导航的数据
    • 3.3.2 渲染分类导航的UI结构
    • 3.3.2 点击第一项，切换到分类页面
  • 3.4 楼层区域
  • • 3.4.1 获取楼层数据
    • 3.4.2 渲染楼层标题
    • 3.4.3 渲染楼层里的图片
    • 3.4.4 点击楼层图片跳转到商品列表页
  • 3.5 分支的合并与提交

3、首页

3.0 创建home分支

运行如下命令，基于master分支在本地创建home子分支，用来开发和home首页相关的功能：

git checkout -b home
git branch

3.1 配置网络请求

由于平台限制，小程序项目不支持axios，而且原生的wx.request()API功能简单，不支持拦截器等全局制定功能，因此，建议在uni-app项目中使用@escook/request-miniprogram第三方包发起网络请求。

官方地址：https://www.npmjs.com/package/@escook/request-miniprogram

1、安装，在项目根目录，打开cmd运行以下命令：