37、购物车_商品数量编辑
数量的编辑
1 “+””-”按钮绑定同一个点击事件区分的关键自定义属性
1 "+" "+1"
2 "-" "-1"
2 传递被点击的商品id goods_id
3 获取data中的购物车数组来获取需要被修改的商品对象
3.1当购物车的数量=1同时用户点击 “-"(实现在下一篇博文)
4 直接修改商品对象的数量num
5 把cart数组重新设置回缓存中和data中 this.setCart
pages\cart\index.wxml
<!--商品信息-->
<view class="cart_info_wrap">
<view class="goods_name">{
{item.goods_name}}</view>
<view class="goods_price_wrap">
<view class="goods_price">¥{
{item.goods_price}}</view>
<view class="cart_num_tool">
<view bindtap="handleItemNumEdit" data-id="{
{item.goods_id}}" data-operation="{
{-1}}" class="num_edit">-</view>
<view class="goods_num">{
{item.num}}</view>
<view bindtap="handleItemNumEdit" data-id="{
{item.goods_id}}" data-operation="{
{1}}" class="num_edit">+</view>
</view>
</view>
</view>
pages\cart\index.js
// 商品数量的编辑功能
handleItemNumEdit(e){
// 1 获取传递过来的参数
const {
operation,id}=e.currentTarget.dataset;
// 2 获取购物车数组
let {
cart}=this.data;
// 3 找到需要修改的商品的索引
const index=cart.findIndex(v=>v.goods_id===id);
// 4 进行修改数量
cart[index].num+=operation;
// 5 设置回缓存和data中
this.setCart(cart);
}