前文:

今天踩了一下午的坑,但是确实很简单的问题。

我说一下需求:扫描商品的二维码,从而判断,同一个二维码不可多次扫描;

点击扫一扫 会在灰色区域展示 扫描的商品信息,比如商品名称,商品码等,但是我们的需求是一物一码,即使是同一个商品也是不同的商品码。

错误示例:

最开始我的想法是做判断,因为我会在相对应的js文件中定义一个 productList:[ ],数组来存放数据,

Pages({
productList: [用来存放,通过后台接口得到的相关商品的数据信息] })

由于我们是一物一码,那唯一的判断条件就是商品码了

wzy.post("/wx/open/getProdcutNameByCode", product, true)
.then((res) => { let products={
name: res.data.data,
code:product.code,
} let productLength = this.data.productIist.length; //如果列表没有直接推,如果有循环,如果
if (productLength==0){
this.data.productIist.push(products);
this.setData({
productIist: this.data.productIist
})
}else{ for (let i = 0; i < productLength;i++){
if (products.code == this.data.productIist[i].code){
global.jv.showPop('提示','同一商品不可重复扫描')
return
}
}
this.data.productIist.push(products);
this.setData({
productIist: this.data.productIist
})
}
}).catch((res) => {
console.log(res)
wzy.showPop('提示', '当前网络繁忙,请重新扫描')
})
},

原来的思路是:

 .then((res) => {

               let products={
name: res.data.data,
code:product.code,
} let productLength = this.data.productIist.length; //如果列表没有直接推,如果有循环,如果
if (productLength==0){
this.data.productIist.push(products);
this.setData({
productIist: this.data.productIist
})
}else{
// 原来思路:把数组中的每一项code取出来与扫码得到的code进行对比,如果不相等就push到数组中 从而在页面循环,但是发现
// 当数组的length>1的情况下,会发生即使你扫码得到的code不与原数组相同但是会重复多次,次数由productIist.length决定             productIist.forEach(item=>{
if(item.code !==this.data.productIist.code ) {
this.data.productIist.push(products);
this.setData({
productIist: this.data.productIist
})
} })
}).catch((res) => {
console.log(res)
wzy.showPop('提示', '当前网络繁忙,请重新扫描')
})
},

所以 在上面的正确的示例中 使用for循环 并把判断也写进for循环中  如果数组中的code与扫描的code相等 就会弹出提示框,并且不会执行下面代码,但是当条件不相符的时候,便可以愉快的执行下面的代码了。

文中的wzy封装的方法

微信小程序之条件判断的更多相关文章

  1. 微信小程序-视图条件渲染

    条件渲染 wx:if 在框架中,我们用 wx:if="{{condition}}" 来判断是否需要渲染该代码块: <view wx:if="{{condition} ...

  2. 微信小程序:如何判断数组中的条数?

    可以<view wx:if="{{list.length == 0}}"> </view> 可以在 {{}} 内进行简单的运算,包括三元运算符.逻辑判断.算 ...

  3. 微信小程序:条件渲染wx:if和hidden

    一.条件渲染:wx:if,wx:elif,wx:else 花括号中的true或false可以改成变量从而来动态显示. 二.hidden 只显示hidden2 当标签不是频繁切换显示(控制是否渲染到页面 ...

  4. 微信小程序-if条件渲染

    #index.wxml <view>今天吃啥</view> <view wx:if="{{condition==1}}"> 饺子 </vi ...

  5. 微信小程序的页面渲染(if/for)

    下面,粗略的介绍一下微信小程序的条件渲染.列表渲染.数据绑定等,详细的内容大家可以去看微信小程序的API,在此只做简单描述,希望能帮助到大家 条件渲染 <!--wxml--> <vi ...

  6. 微信小程序学习指南

    作者:初雪链接:https://www.zhihu.com/question/50907897/answer/128494332来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明 ...

  7. 微信小程序与vueJs的异同

    简而言之,所有的框架都是建立在原生javascript基础之上的,所以对于有一定js基础的同学来说,各种框架都是比较容易入手的,但不同的框架之间又有一定的差别,有时候切换使用时就会掉入坑了. 一.微信 ...

  8. 如何开发微信小程序学习

    文件中 project.config.json是开发者工具为我们自动生成的一个开发者工具的配置文件,主要是保存了一些我们对开发者工具的个性化配置. 一个微信小程序应用至少要有两个文件 一个是app.j ...

  9. 小程序开发运营必看:微信小程序平台运营规范

    一.原则及相关说明 ​ 微信最核心的价值,就是连接——提供一对一.一对多和多对多的连接方式,从而实现人与人.人与智能终端.人与社交化娱乐.人与硬件设备的连接,同时连接服务.资讯.商业. ​ 微信团队一 ...

随机推荐

  1. Flutter 之页面状态保持

    一般情况下,我们使用tab切换的时候希望操作完毕之后,能够记住上个页面的状态, 但是使用Flutter的BottomNavigationBar的 时候默认是不记录页面状态的,即切换页面会导致重新加载. ...

  2. 对MySQL索引、锁及事务的简单分析

    一.索引的数据结构 1.二叉搜索树实现的索引 二叉搜索树如下图,它查找元素的时间复杂度为O(logn) 但如果经常出现增删操作,最后导致二叉搜索树变成线性的二叉树,这样它查找元素的时间复杂度就会变成O ...

  3. Linux系统目录结构和文件基本属性

    一.Linux系统目录结构 二.Linux 文件基本属性 三.touch stat tar 命令 一.Linux系统目录结构 不同颜色文件的含义: inux 文件颜色的含义,蓝色代表目录,绿色代表可执 ...

  4. JavaJDBC【四、存储过程的使用】

    Mysql还没学到存储过程,不过语法比较简单 此处不深究数据库中的存储过程怎么创建,后面在mysql的学习笔记里再做整理 今天只整理java中如何调用存储过程 语句 CallableStatement ...

  5. busybox date 时间的加减

    1.下载安装busybox: # wget http://busybox.net/downloads/busybox-1.29.3.tar.bz2 # tar -jxvf busybox-.tar.b ...

  6. HTML 做圆形头像

    Click me <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  7. python基础编程: 编码补充、文件操作、集合、函数参数、函数递归、二分查找、匿名函数与高阶函数

    目录: 编码的补充 文件操作 集合 函数的参数 函数的递归 匿名函数与高阶函数 二分查找示例 一.编码的补充: 在python程序中,首行一般为:#-*- coding:utf-8 -*-,就是告诉p ...

  8. Redis03——Redis架构

    Redis架构 1.1.问题 redis是单线程,单实例,为什么并发那么多,依旧很快呢? 回答:因为调用了系统内核的epoll 1.2.Linux的早期版本 Linux有Linux kernal,我们 ...

  9. 获取header信息

    获取header信息 function _get_all_header() { // 忽略获取的header数据.这个函数后面会用到.主要是起过滤作用 $ignore = array('host',' ...

  10. ClassLoader心得

              我们都知道,jvm执行的代码,都是通过jvm加载系统加入的.加载系统的第一步是通过ClassLoader加载class二进制信息,jvm规范中并没有规定class的来源类型,这就给 ...