纯静态微信小程序零售商贩项目

购物细节代码

<view class="main">
    <view class="goods-box">
        <image src="{{goods.image}}" class="goods-thumb"></image>
        
        <navigator open-type="switchTab" url="../cart/cart">
            <view class="carts-icon {{scaleCart?'on':''}}">
                <image src="/image/cart2.png"></image>
                <text class="carts-icon-num" wx:if="{{hasCarts}}">{{totalNum}}</text>
            </view>
        </navigator>
        
        <view class="goods-operation">
            <text class="goods-operation-num">数量  {{num}}</text>
            <text class="goods-operation-add" bindtap="addCount">+</text>
            <text class="goods-to-cart" bindtap="addToCart">加入购物车</text>
            <image src="/image/cart1.png"  class="goods-cart-img" bindtap="addToCart"></image>
        </view>
        <image wx:if="{{show}}" src="/image/cart1.png" class="to-carts-icon"></image>
        <view class="goods-stock">{{goods.stock}}</view>
        <view class="goods-title">{{goods.title}}</view>
        <view class="goods-price">￥ {{goods.price}}</view>
    </view>
    <view class="goods-tab-box">
        <view class="goods-tab-nav {{curIndex === 0 ?'on':''}}" bindtap="bindTap" data-index="0">商品详情</view>
        <view class="goods-tab-nav {{curIndex === 1 ?'on':''}}" bindtap="bindTap" data-index="1">产品参数</view>
        <view class="goods-tab-nav {{curIndex === 2 ?'on':''}}" bindtap="bindTap" data-index="2">售后保障</view>
        <view class="goods-content">
            <view wx:if="{{curIndex === 0}}">{{goods.detail}}</view>
            <view wx:if="{{curIndex === 1}}">{{goods.parameter}}</view>
            <view wx:if="{{curIndex === 2}}">{{goods.service}}</view>
        </view>
    </view>
</view>

购物车代码

<view class="main">
    <view wx:if="{{hasList}}">
        <view class="cart-box">
            <view class="cart-list" wx:for="{{carts}}" wx:key="{{index}}">
                <icon wx:if="{{item.selected}}" type="success" color="red" data-index="{{index}}"  class="cart-pro-select" bindtap="selectList"/>
                <icon wx:else type="circle" class="cart-pro-select" data-index="{{index}}" bindtap="selectList"/>
                <navigator url="../details/details?id={{item.id}}"><image class="cart-thumb" src="{{item.image}}"></image></navigator>
                <text class="cart-pro-name">{{item.title}}</text>
                <text class="cart-pro-price">￥{{item.price}}</text>
                <view class="cart-count-box">
                    <text class="cart-count-down" bindtap="minusCount" data-obj="{{obj}}" data-index="{{index}}">-</text>
                    <text class="cart-count-num">{{item.num}}</text>
                    <text class="cart-count-add" bindtap="addCount" data-index="{{index}}">+</text>
                </view>
                <text class="cart-del" bindtap="deleteList" data-index="{{index}}">×</text>
            </view>
        </view>

        <view class="cart-footer">
            <icon wx:if="{{selectAllStatus}}" type="success_circle" color="#fff" class="total-select" bindtap="selectAll"/>
            <icon wx:else type="circle" color="#fff" class="total-select" bindtap="selectAll"/>
            <view class="order-icon">
                <navigator url="../orders/orders"><image src="/image/icon3.png"></image></navigator>
            </view>
            <text>全选</text>
            <text class="cart-toatl-price">￥{{totalPrice}}</text>
        </view>
    </view>
    <view wx:else>
        <view class="cart-no-data">购物车是空的哦~</view>
    </view>
</view>

码影行者 (lilisen.cn)获取源码
运行部分截图