这篇“微信小程序购物车功能如何开发”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“微信小程序购物车功能如何开发”文章吧。
index.wxml:
[html] view plain copy<!--主盒子--> <view class="container"> <!--head--> <view class="tit"> <view class="title_val">商品列表</view> <view class="more">更多</view> </view> <!--list--> <view class="goodslist"> <!--item--> <block wx:for="{{goodslist}}"> <view class="goods"> <!--左侧图片盒子--> <view> <image src="{{item.imgUrl}}" class="good-img" /> </view> <!--右侧说明部分--> <view class="good-cont"> <!--上--文字说明--> <view class="goods-navigator"> <text class="good-name">{{item.name}}</text> </view> <!--下--价格部分--> <view class="good-price"> <text>¥{{item.price}}</text> <image id="{{item.id}}" class="cart" src="/images/new_73.jpg" bindtap="addcart" /> </view> </view> </view> </block> </view> </view>
index.wxss:
[css] view plain copy page{ height: 100%; } .container{ background: #f5f5f5; } .tit{ display: flex; flex-direction: row; justify-content: space-between; height: 30px; position: relative; } .tit::before{ content:''; background: #ffcc00; width:5px; height: 100%; position: absolute; left: 0; top: 0; } .title_val{ padding: 0 15px; font-size: 14px;
以上就是关于“微信小程序购物车功能如何开发”这篇文章的内容,相信大家都有了一定的了解,希望小编分享的内容对大家有帮助,若想了解更多相关的知识内容,请关注编程网行业资讯频道。