<!--pages/shop/shop.wxml-->
<view wx:if="{{hasList}}">
<view class="container carts-list">
<view wx:key="isshop" wx:for="{{carts}}" class="carts-item" >
<view class="carts-choice">
<icon wx:if="{{item.selected}}" type="success" color="rgba(255,51,0,1)" size="30" bindtap="bindCheckbox" data-index="{{index}}"/>
<icon wx:else type="success" color="rgba(255,51,0,0.1)" size="30" bindtap="bindCheckbox" data-index="{{index}}"/>
</view>
<view class="carts-image">
<image src="{{item.image}}"></image>
</view>
<view class="carts-text">
<view class="carts-title">
<text>{{item.teaname}}</text>
</view>
<view class="carts-subtitle">
<text>¥{{item.price}}</text>
</view>
<!-- 加减号控制数量---------------------------------------- -->
<view class="stepper">
<!-- 减号 -->
<text class="{{minusStatuses[index]}}" disabled="true" data-index="{{index}}" bindtap="bindMinus">-</text>
<!-- 数值 -->
<!-- <input type="number" bindinput="bindManual" value="{{item.num}}" /> -->
<view class="number" bindchange="bindManual">{{item.num}}</view>
<!-- 加号 -->
<text class="normal" data-index="{{index}}" bindtap="bindPlus">+</text>
</view>
</view>
<view class="delete">
<view class="delete-img" bindtap="deleteList" data-index="{{index}}">
<image src="../../imgs/car/shopping_del.png"></image>
</view>
</view>
</view>
</view>
<!------------------------------------------ -->
<!-- 点击结算弹出框 -->
<!-- <toast show="{{toastHidden}}" bindchange="bindToastChange">
{{toastStr}}
</toast> -->
<!-- 点击结算弹出框 -->
<!-- <toast show="{{toastHidden}}" bindchange="bindToastChange">
加载
</toast> -->
<!-- 全选和结算---------------------------------------- -->
<view class="carts-footer">
<view class="all-chioce">
<view class="footer-left">
<icon wx:if="{{selectedAllStatus}}" type="success" color="rgba(255,51,0,1)" size="30" bindtap="bindSelectAll"/>
<icon wx:else type="success" color="rgba(255,51,0,0.1)" size="30" bindtap="bindSelectAll"/>
<text>全选</text>
</view>
<view class="footer-right">
<view class="right-text">
<text>合计</text>
<text>{{total}}</text>
</view>
<view class="free">
<text>不含运费及优惠</text>
</view>
</view>
</view>
<view class="button">立即结算</view>
</view>
</view>
<view wx:if="{{!hasList}}" class="">
<text>购物车为空的时候的布局</text>
<view class="" bindtap="tobackHome" >返回首页</view>
</view>

微信 小程序组件 加入购物车全套 one wxml的更多相关文章

  1. 微信 小程序组件 加入购物车全套 one js

    // pages/shop/shop.js Page({ /** * 页面的初始数据 */ data: { carts: [ { teaname: '冠军乌龙茶-150g', image: '../. ...

  2. 微信 小程序组件 加入购物车全套 one wxss

    //1,wxss /*外部容器*/ .container { display: flex; flex-direction: column; align-items: center; justify-c ...

  3. 微信小程序组件设计规范

    微信小程序组件设计规范 组件化开发的思想贯穿着我开发设计过程的始终.在过去很长一段时间里,我都受益于这种思想. 组件可复用 - 减少了重复代码量 组件做为抽离的功能单元 - 方便维护 组件作为temp ...

  4. 微信小程序组件学习 -- 注册页面

    微信小程序组件使用手册地址: 1. 百度搜索"微信公众平台",扫码登录之后,点击帮助文档里面的普通小程序. 2. 接着选择"开发"-->"组件& ...

  5. 微信小程序开发:学习笔记[2]——WXML模板

    微信小程序开发:学习笔记[2]——WXML模板 快速开始 介绍 WXML 全称是 WeiXin Markup Language,是小程序框架设计的一套标签语言,结合小程序的基础组件.事件系统,可以构建 ...

  6. 【腾讯Bugly干货分享】打造“微信小程序”组件化开发框架

    本文来自于腾讯Bugly公众号(weixinBugly),未经作者同意,请勿转载,原文地址:http://mp.weixin.qq.com/s/2nQzsuqq7Avgs8wsRizUhw 作者:Gc ...

  7. 微信小程序(组件demo)以及预览方法:(小程序交流群:604788754)

    1. 获取微信小程序的 AppID 登录 https://mp.weixin.qq.com ,就可以在网站的"设置"-"开发者设置"中,查看到微信小程序的 Ap ...

  8. 详解封装微信小程序组件及小程序坑(附带解决方案)

    一.序 上一篇介绍了如何从零开发微信小程序,博客园审核变智障了,每次代码都不算篇幅,好好滴一篇原创,不到3分钟从首页移出来了.这篇介绍一下组件封装和我的踩坑历程. 二.封装微信小程序可复用组件 首先模 ...

  9. 微信小程序组件通信

    父子通信 在子组件的对应js中 properties:{ prop名字:数据类型, prop名字:{ type:数据类型, value:默认值 } } 在父组件的wxml模板中找到子组件标签 < ...

随机推荐

  1. MP实战系列(十四)之分页使用

    MyBatis Plus的分页,有插件式的,也有其自带了,插件需要配置,说麻烦也不是特别麻烦,不过觉得现有的MyBatis Plus足以解决,就懒得配置插件了. MyBatis Plus的资料不算是太 ...

  2. -bash: fork: retry: Resource temporarily unavailable;centos6.5

    Last login: Wed Jun 18 14:04:11 2014 from 1.1.1.135 -bash: fork: retry: Resource temporarily unavail ...

  3. 教你一些Linux中隐藏bash历史命令的小技巧

    导读 如果你登录过 Linux 系统,并敲过一些命令,那你应该知道,bash history 会记录你输入的所有命令.这个操作其实是有一定风险的. 我个人经常使用 Linux,所以我想着研究一番,看看 ...

  4. PAT B1007 素数对猜想 (20 分)

    让我们定义d​n​​为:d​n​​=p​n+1​​−p​n​​,其中p​i​​是第i个素数.显然有d​1​​=1,且对于n>1有d​n​​是偶数.“素数对猜想”认为“存在无穷多对相邻且差为2的素 ...

  5. hadoop集群部署配置补充

    /etc/hosts192.168.153.147 Hadoop-host192.168.153.146 Hadoopnode1 192.168.153.145 Hadoopnode2::1 loca ...

  6. scapy学习笔记(1)

    转载请注明:小五义 http://www.cnblogs.com/xiaowuyi scapy是python写的一个功能强大的交互式数据包处理程序,可用来发送.嗅探.解析和伪造网络数据包,常常被用到网 ...

  7. 详细解读Spark的数据分析引擎:Spark SQL

    一.spark SQL:类似于Hive,是一种数据分析引擎 什么是spark SQL? spark SQL只能处理结构化数据 底层依赖RDD,把sql语句转换成一个个RDD,运行在不同的worker上 ...

  8. 20155236范晨歌_Web基础

    20155236范晨歌_Web基础 目录 实践目标 Apache 前端编程 后端编程 PHP MYSQL & 后端 简单SQL注入与XSS 发帖和会话管理 实践目标 (1)Web前端HTML ...

  9. 汇编 fsub ,fmul,fdiv,fild,CVTTPS2PI 指令

    知识点:  浮点指令 fsub 一.浮点指令fsub 格式 fsub memvar // st0=st0-memvar 知识点:  浮点指令 fmul 一.浮点指令fmul 格式 fmul mem ...

  10. 汇编 ADD指令

    知识点: 加法汇编指令ADD 一.加法指令 ADD(Addition) 格式 格式: ADD A,B //A=A+B; 功能: 两数相加 . OPRD1为任一通用寄存器或存储器操作数,可以是任意一个 ...