小程序传参，加，减

最新推荐文章于 2024-07-25 21:27:06 发布

笑到全世界流泪s

最新推荐文章于 2024-07-25 21:27:06 发布

阅读量123

点赞数

分类专栏：小程序

本文链接：https://blog.csdn.net/weixin_52309490/article/details/115670903

版权

小程序专栏收录该内容

8 篇文章 0 订阅

订阅专栏

本文介绍了如何在微信小程序中实现购物车功能。首先定义了一个空的`cartList`数组，然后将从服务器获取的商品数据赋值给它。接着，通过`<view>`组件展示购物车内容，并为加减按钮绑定点击事件`cartAdd`。在`cartAdd`函数中，当点击加号时，更新商品的数量并调用`getName`函数更新视图和总价。整个过程涉及到了数据绑定、事件处理和状态管理。

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

先定义个空的数组

data: {
    cartList: [],
  },

定义好的数组赋值

this.setData({
    cartList: res.items,
    num: res.price,
})

然后更新视图

 <view class="yc_cart_contnet">
  <view class="yc-a-gooods" wx:for="{{cartList}}" wx:key="goodsId">
      <view class="yc_a_list" style="{{item.status}};" bindtouchmove="change" data-index="{{index}}" bindtouchstart="touchS" bindtouchend="touchE">
        <view class="yc_box_son">
          <view class="yc_cart_radio">
            <radio checked="{{item.selected}}" bindtap="chang" data-item="{{item}}" data-selected="selected" />
          </view>
          <view class="yc_image_son">
            <image src="{{item.pic}}"></image>
          </view>
          <view class="yc_box_cont">
            <view>{{item.name}}</view>
            <view class="yc_son_box">
              <view>￥{{item.price}}</view>
              <view class="yc_arr_box">
                <button size="mini" bindtap="cartRout" data-item="{{item}}">-</button>
                <view>{{item.number}}</view>
                <button  size="mini" bindtap="cartAdd" data-item="{{item}}">+</button>
              </view>
            </view>
          </view>
        </view>
        <view class="yc_son_bos" wx:key="{{item.key}}" bindtap="del" data-item="{{item}}">删除</view>
      </view>
  </view>

给加号一个点击事件

<view class="yc_arr_box">
    <button size="mini" bindtap="cartRout" data-item="{{item}}">-</button>
    <view>{{item.number}}</view>
    <button  size="mini" bindtap="cartAdd" data-item="{{item}}">+</button>
</view>

点击加号更新视图

 cartAdd(e) {
    console.log(e);
    let key = e.currentTarget.dataset.item.key//获取key
    let number = e.currentTarget.dataset.item.number//获取number
    if (number > 0) {
    //key、number以性参的方式传过去
      getName(key, number + 1).then(res => {
        console.log(res);
        this.setData({
          cartList: res.items,//视图更新
          num: res.price//合计
        })
      })
    }
  },