購(gòu)物車(chē)頁(yè)面布局
?文章來(lái)源：http://www.zghlxwxcb.cn/news/detail-421281.html
引入 WeUI：文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-421281.html
{
"usingComponents": {
"mp-cells": "weui-miniprogram/cells/cells",
"mp-cell": "weui-miniprogram/cell/cell",
"mp-slideview": "weui-miniprogram/slideview/slideview"
},
"navigationBarTitleText": "購(gòu)物車(chē)"
}<!--pages/shopcar/shopcar.wxml-->
<mp-cells ext-class="my-cells" title="購(gòu)物車(chē)商品信息" footer="左滑可以刪除" wx:if="{
{cartList.length}}">
<!-- 左滑刪除功能 -->
<mp-slideview buttons="{
{slideButtons}}" bindbuttontap="slideButtonTap" wx:for="{
{cartList}}" wx:key="index" data-id="{
{item.id}}">
<mp-cell>
<!-- 使用slot插槽的footer，固定具體右側(cè)的數(shù)量增減功能 -->
<view slot="footer" class="cellfooter">
<text bindtap="handleMinus" data-item="{
{item}}">-</text>
<text>{
{item.number}}</text>
<text bindtap="handleAdd" data-item="{
{item}}">+</text>
</view>
<view class="content">
<!-- 內(nèi)容區(qū)域的勾選欄 -->
<checkbox checked="{
{item.checked}}" bindtap="handleChecked" data-item="{
{item}}"></checkbox>
<!-- 商品圖片 -->
<image src="http://localhost:5000{
{item.good.poster}}" mode="aspectFit">
</image>
<!-- 商品名稱(chēng)價(jià)格 -->
<view style="font-size: 26rpx;">
<view>{
{item.good.title}}</view>
<view style="color: red;">價(jià)格：{
{item.good.price}}</view>
</view>
</view>
</mp-cell>
</mp-slideview>
</mp-cells>
<view wx:els到了這里，關(guān)于微信小程序 - 商城項(xiàng)目 - 購(gòu)物車(chē)的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
