<!--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. Node.js实战(八)之回调函数

    Node.js 异步编程的直接体现就是回调. 异步编程依托于回调来实现,但不能说使用了回调后程序就异步化了. 回调函数在完成任务后就会被调用,Node 使用了大量的回调函数,Node 所有 API 都 ...

  2. Qt5中运行后台网络读取线程与主UI线程互交

    项目中有一个需求就是,因为需要请求服务端数据,因为网络的读取会阻塞,所以该过程不能放在Qt中的UI主线程当中,需要用一个后台线程来读取数据,数据准备完毕后 在通过Qt5中的信号槽机制来跨线程的传递数据 ...

  3. 无法找到“XXX.exe”的调试信息,或者调试信息不匹配。未使用调试信息生成二进制文件

    1.问题症状 已经处于Debug模式,运行时完全正常,但是一调试就出现对话框,显示出错信息:“无法找到“XXX.exe”的调试信息,或者调试信息不匹配.未使用调试信息生成二进制文件.” 2.解决方法 ...

  4. OpenCV——反向投影(定位模板图像在输入图像中的位置)

    反向投影: #include <opencv2/opencv.hpp> #include <iostream> using namespace cv; using namesp ...

  5. day36

    今日内容 1.GIL解释器锁 2.GIL解释器锁与自定义锁 3.死锁现象与递归锁 4.信息量 5.Event 6.线程queue 1.GIL解释器锁 from multiprocessing impo ...

  6. Linux线程的信号量同步

    信号量和互斥锁(mutex)的区别:互斥锁只允许一个线程进入临界区,而信号量允许多个线程同时进入临界区. 不多做解释,要使用信号量同步,需要包含头文件semaphore.h. 主要用到的函数: int ...

  7. Django Rest Framework源码剖析(七)-----分页

    一.简介 分页对于大多数网站来说是必不可少的,那你使用restful架构时候,你可以从后台获取数据,在前端利用利用框架或自定义分页,这是一种解决方案.当然django rest framework提供 ...

  8. 网络对抗技术 2017-2018-2 20152515 Exp 8 Web基础

    1.本实践的具体内容: (1).Web前端HTML(0.5分) 输入命令apachectl start打开apahce,并查看端口号,确认apache开启: 在kali浏览器中输入localhost: ...

  9. 20155216 Exp3 免杀原理与实践

    Exp3 免杀原理与实践 基于特征码的改变来实现免杀(实践过程记录) MSF编码器编译后门检测 可以通过VirSCAN来检验后门抗杀能力. ps:选择后门前修改其文件名,不得含有数字. 如上图所示,3 ...

  10. 20155331 《网络对抗》 Exp6 信息搜集与漏洞扫描

    20155331 <网络对抗> Exp6 信息搜集与漏洞扫描 实验问题回答 哪些组织负责DNS,IP的管理 答:美国政府授权ICANN统一管理全球根服务器,负责全球的域名根服务器.DNS和 ...