黑马优购项目讲解

最新推荐文章于 2023-01-04 15:07:29 发布

shiqianhui1124

最新推荐文章于 2023-01-04 15:07:29 发布

阅读量760

点赞数

分类专栏：黑马优购项目讲解

本文链接：https://blog.csdn.net/shiqianhui1124/article/details/116973716

版权

本文详细讲解了黑马优购项目的实施步骤，包括准备工作和页面逻辑实现。在准备工作阶段，涉及公共组件封装、接口请求的Promise封装以及iconfont图标的引用。在页面逻辑部分，分别阐述了首页数据请求与渲染、分类页的tab切换、购物车页面的本地存储操作以及个人中心页面的登录逻辑。项目涵盖了微信小程序开发的关键技术。

摘要由CSDN通过智能技术生成

黑马优购项目讲解：

准备项目前期准备工作，把项目划分为四个主体部分：首页、分类、购物车以及我的页面。

1.准备工作：

封装公共组件、request请求以及iconfont图标的引用：

1-1.公共组件的封装

在根目录下创建components文件，放置封装好的公共组件

1-2.接口api的请求和对使用promise对request的封装

在根目录下创建http文件夹，在文件夹里创建app.js和request.js文件

api.js文件对接口地址进行封装

module.exports={
  "swiper":"/home/multidata"
}

使用promise对request请求进行封装

// 同时发送异步代码的次数
let ajaxTimes=0;
export const request=(params)=>{
  // 判断 url中是否带有 /my/ 请求的是私有的路径 带上header token
  let header={...params.header};
  if(params.url.includes("/my/")){
    // 拼接header 带上token
    header["Authorization"]=wx.getStor