优选商品
分析做法：
1.首页
2.分类
3.商品列表
4.商品详情
5.购物车
6.支付
7.授权
8.问题反馈
一、首页
1.首先布局
1.上面那个搜索可以拆出去因为后面也要用
2.轮播图也可以拆出去
然后就获取接口渲染 用 wx:for="{ {数组 }}"、
用到的接口：
轮播图 https://api-hmugo-web.itheima.net/api/public/v1/home/swiperdata
分类 https://api-hmugo-web.itheima.net/api/public/v1/home/catitems
楼梯 https://api-hmugo-web.itheima.net/api/public/v1/home/floordata
4.我们会发现这些接口由基地址跟借口集合组成的可以封装一下调用，可以在获取接口的使用减少代码量
分装propmise:
1.在js中封装propmise，然后在另一个js中设置接口的集合
然后在http.js中导入二个文件、然后配置基地址
导出一个基地址+数据的集合{}，拼接的数据+gie/post请求
然后在全局的app.json中导入注册 就可以在组件中使用了
二、分类页面
1.也是一样先布局
左边跟右边都使用wx:scroll-view 组件设置固定高度才能往下走
加粗样式也是获取接口然后渲染
2.点击左边的话传一个index过去根据index获取点击的children然后渲染到右边
3.跟着走的样式也是一样传值index根据index去走样式
4.这里要注意一个问题，刚刚说的是点击获取的数据、那么页面刷新的时候的数据是：
当页面刷新的时候循环一个死数据
然后点击的时候切换数据即可
设置一个初始值：false
当点击左边的数据的时候index会跟着走，所以用index判断
判断的内容是:如果index没有动那么就证明页面是死数据
点击就是活的，
我们可以在js中判断一下；
index==0就是没有动的初始值就为false
index!=0就是动了的就为true
然后就可以在页面中判断一下
索引值等于0的时候显示死数据
等于活的时候显示活数据
商品lie列表页面：
由于接口需要传值cat_id
我们得在页面中设置点击事件把item传过去 用 data-item=“{ {item}}”
然后用js把从item拿到cat_id 然后传到商品列表页面
三、商品列表
搜索跟综合、销量、价格切换都说过了，就不说了
下面就是数据渲染调用分装的接口传递接口所需要的数据
接收数据后用数组接收然后wx:for 循环
这个页面有一个下拉刷新跟上拉加载
上拉刷新的话：
1.先开启上拉加载的log动画
"backgroundTextStyle": "dark",
"navigationBarTitleText": "商品详情",
"enablePullDownRefresh": true
2.开启后js中有生命周期函数：
list清空
当前页面为1
调用封装的方法
这里也要注意一个问题下拉刷新的时候log动画时间长
加一个 wx.stopPullDownRefresh();就OK；
onPullDownRefresh: function () {
//页面相关事件处理函数--监听用户下拉动作
this.setData({
list: []
})
wx.showLoading({
title: '加载',
})
this.data.pagenum = 1
this.gh()
wx.stopPullDownRefresh();
},
上拉加载的话就是：在这个之前先计算出来当前页面的条数
条数 是（总页面/请求的页数）这个算出来的是
小数可以要用Math.cil 向上取整
有了这些数据之后就好做了
然后就是上拉加载的时候让请求的页数++，调用接口
然后就是判断如果每页的条数等于请求的页数的使用
就判断为已经到底了
商品详情
由于商品详情要用到good_cid
所以这里也一样；我们设置点击事件传item
在js中把item中的item的goods_cid拿出来，跳页面的时拼接上
hhh(e) {
console.log(e);
var id = e.currentTarget.dataset.item.goods_id
console.log(id);
wx.navigateTo({
url: '/pages/goods_detail/goods_detail?id=' + id,
})
},
四、商品详情
接过来传递的goods_cid 在刷新页面的生命周期函数里面接收
var id = options.id
有的goods_cid请求封装的接口然后数组接收然后渲染即可
收藏：
1.先实现收藏空实心切换
先布局一个空心的一个实心的
设置一个初始值：false
点击空心时让为true
在页面中判断一下空心用初始值
实心用初始值的反之
2.然后调用本地存储里面的数据必须是一个数组
var k = wx.getStorageSync("k") || []
3.判断 k就是本地存储中取出来的值
findIndex：是去数组里面搜索如果搜索到了就返回一个index，如果没有就返回一个-1
用findIndex去判断出索引值去判断
等于-1就是本地存储值不存在可以添加进去、
如果不等于-1就证明里面有那就删除用 splice（index，1）
最后在存到本地存储里面：
wx.setStorageSync('k', k)
联系/客服
就是一个button按钮的属性运用
地址：
加入购物车
也是差不多也是获取本地存储里面的数据也是数组也是用findIndex
如果是index是-1那就添加进去、把数量还有初始值加进去
如果不是就num++
最后也是一样 存回到本地存储
然后给一个添加成功的log
点击那个购物车然后跳转到购物车就可以
跳转之前调用一下监听页面初次渲染完成的钩子函数要不然到购物车页面不会自动刷新添加的购物车数据还得手动刷新
五、购物车
1.获取收货地址
点击添加收货地址的时候本来是要判断健全的由于微信的更新就不用了
点击直接获取收货地址
1. wx.chooseAddress({
success : (result) => {
} })
然后存到本地存储里面，在js中在定义一个对象 对象接收收货地址
去页面中渲染、点击收货地址获取到收货地址的话，button隐藏
内容显示即可
全选：
点击全选的时候先设置相反的值，让点击切换，
然后在便利 forEach 点击全选的时候商品也选中，再点一下就不选中
单选：
也是差不多的
先获取索引值，然后先设置点击时为相反值
利用便利设置一个空数组；当点击单选为true的时候把存进去
然后判断存进去的长度length如果等于添加商品的length就让他为true
否则就为false
