<block wx:for="{{salesList}}" wx:for-index="index" wx:key="id" wx:for-item="item">
<view class="con_txt">
<view class="con_txt1" style="margin-left:30rpx;width:140rpx">销售品申请</view>
<view class="con_txt1 con_txt2">
<view class="section">
<picker bindchange="bindPickerChange" value="{{item.option}}" range="{{objectArray}}" range-key="good_name" data-id="{{objectArray[item.option].id}}" data-index="{{index}}">
<view class="picker" style="height:70rpx;position:relative">
{{objectArray[item.option].good_name}}
<image src="../Image/select.png" style="width:40rpx;height:40rpx;position:absolute;left:80%;top:20%;"></image>
</view>
</picker>
</view>
</view>
<view class="con_txt1">
<view class="section2">
<input value="{{salesList[index].nums}}" name="count" bindinput="numChangeS" data-index="{{index}}" style="text-align:center;height:66rpx !important;padding-top:4rpx;" placeholder-style="color:#ddd;text-align:center;margin-top: 0px;margin-left:-8rpx" placeholder="数量"/>
</view>
</view>
<button class="btnC" hover-class="none" bindtap="reduceSales" data-index="{{index}}">-</button>
</view>
</block>
<view class="hb" bindtap="addSales">
<image src="../Image/addT.png" style="width:30rpx;height:30rpx;float:left;margin-left:38%;"></image>
<view class="text3">继续增加商品</view>
</view>
data: {
salesList: [] //定义一个空数组
},
//销售品删除一行
reduceSales: function (e) {
var that = this;
var index = e.currentTarget.dataset.index;
var list = that.data.salesList;
if (list.length === 1) {
return;
}
list.splice(index, 1);
this.setData({
salesList: list
})
},
//点击添加销售品
addSales: function (e) {
var that = this;
var list = that.data.salesList;
var r = /^\+?[1-9][0-9]*$/;  //正整数
var tip = '数量请输入正整数~~';
for (var i = 0; i < list.length; ++i) {
if (list[i].nums <= 0 || !r.test(list[i].nums)) {
wx.showToast({
title: tip,
image: '../Image/error.png',
duration: 2000
});
return;
}
}
var options = this.data.objectArray
this.data.salesList.push({ id: options[0].id, nums: '', option: 0 }) //添加新行的时候nums初始为0
this.setData({
salesList: this.data.salesList
}) },
//销售品申请类
bindPickerChange: function (e) {
var arr = this.data.objectArray  //数组;
   var value = e.detail.value; //数组子集
var list = this.data.salesList; //数组传递某一项的容器
   var index = e.currentTarget.dataset.index;  //索引 list[index] = arr[value] //被选中数组的某一项赋给容器的相对应的某一项容器 list[index].option = value //数组子集赋给某一项相对应的容器索引
  this.setData({
salesList: list
})
},
//申请数量
numChangeS: function (e) {
var _that = this;
var index = e.currentTarget.dataset.index;
var list = this.data.salesList
list[index].nums = e.detail.value
this.setData({
salesList: list
})
}, // 页面初始化 options为页面跳转所带来的参数
onLoad: function (options) {
var that = this
wx.request({
url: 'https://....',
method: 'GET',
header: { 'content-type': 'application/json' },
data: {},
success: function (res) { // success
var options = res.data.goods;
that.data.salesList.push({ id: options[0].id, nums: '', option: 0 })
that.data.materielList.push({ id: options[0].id, nums: '', option: 0 })
that.data.activesList.push({ id: options[0].id, option: 0 })
that.setData({
objectArray: options,
salesList: that.data.salesList,
})
},
})
},

微信小程序--问题汇总及详解之picker 增、删的更多相关文章

  1. 微信小程序--问题汇总及详解之form表单

    附上微信小程序开发文档链接:https://mp.weixin.qq.com/debug/wxadoc/dev/framework/MINA.html form表单: 当点击 <form/> ...

  2. 微信小程序--问题汇总及详解之图片上传和地图

    地图用的是百度的地图,链接:http://lbsyun.baidu.com/index.php?title=wxjsapi/guide/getlocation 获取日期时间可以用小程序里自带的js文件 ...

  3. 微信小程序--问题汇总及详解之清空电话号码

    wxml: <view class="btns" wx:for="{{phoneList}}" wx:key="id"> < ...

  4. 微信小程序--问题汇总及详解之tab切换

    设置背景颜色就直接在page里设置    page {background-color: rgb(242, 242, 242);} tab切换: navigator 页面链接 传参的格式为url=&q ...

  5. 微信小程序 this和that详解及简单实例

    微信小程序中,在wx.request({});方法调用成功或者失败之后,有时候会需要获取页面初始化数据data的情况,这个时候,如果使用,this.data来获取,会出现获取不到的情况,调试页面也会报 ...

  6. 微信小程序获取用户手机号详解

    最近在做一款微信小程序,需要获取用户手机号,具体步骤如下: 流程图: 1.首先,客户端调用wx.login,回调数据了包含jscode,用于获取openid(用户唯一标识)和sessionkey(会话 ...

  7. 【微信小程序】支付过程详解

    一.介绍 今天跟大家分享微信小程序集成支付. 二.分析 1.小程序支付API 地址:https://mp.weixin.qq.com/debug/wxadoc/dev/api/api-pay.html ...

  8. 微信小程序支付之代码详解

    微信小程序自带的一套规则,类似vue语法,但是好多功能都集成在api中,给了很多初学者轮子,所以首先要熟悉这些api,忘记可照官网继续开发 这里主要说下微信小程序的支付,原理类似上篇介绍的公众网页支付 ...

  9. 微信小程序项目wx-store代码详解

    这篇文章会很长,非常长,特别长,无敌长. 真的是挤牙膏般的项目进度,差不多是8月底有开始这个项目的想法,时至今日都1个多月了,抛去频繁的加班时间,王者时间,羽毛球时间...见缝插针的写这个项目,我竟然 ...

随机推荐

  1. VMware Workstation Pro 11、12 密钥

    11:1F04Z-6D111-7Z029-AV0Q4-3AEH8 12:5A02H-AU243-TZJ49-GTC7K-3C61N

  2. JS每点击一次添加多少条数据

    很久不写文档,平时只写日记,所以对这个有点生疏,如果写的不好别介意. 今天闲的蛋疼,于是要写写白天的东西,并且以后也会一直更新(一直写)下去. 时间太仓促了,这几个月,今天算最晚的一次凌晨1点,吃不消 ...

  3. Producer & Consumer

    需要与Eureka结合使用 Eureka环境搭建 Producer 一.pom文件 <?xml version="1.0" encoding="UTF-8" ...

  4. Object.keys 函数 (JavaScript)

    Object.keys 函数 (JavaScript) 返回对象的可枚举属性和方法的名称. 在实际开发中,我们有时需要知道对象的所有属性,原生js给我们提供了一个很好的方法:Object.keys() ...

  5. IOS 核心动画(Core Animation)

    Core Animation,中文翻译为核心动画,它是一组非常强大的动画处理API,使用它 能做出非常炫丽的动画效果,而且往往是事半功倍.也就是说,使用少量的代码就 可以实现非常强大的功能. Core ...

  6. POJ 3281 Dining(网络流最大匹配)

    分析: 数学模型是三个集合A,B,C,(a,b,c)构成一个匹配.因为图一个点只能匹配一次,把a拆点a',a", 在可以匹配的点上连边,s - b - a' - a" - c - ...

  7. Web前端学习流程

  8. C语言字符,字符串,字节操作常用函数

    strlen 这个函数是在 string.h 的头文件中定义的 它的函数原型是 size_t strlen( const char ); size_t 是一个无符号整型,是这样定义的 typedef ...

  9. shiro学习记录(一)

    1 权限概述 认证:系统提供的用于识别用户身份的功能,通常登录功能就是认证功能-----让系统知道你是谁?? 授权:系统授予用户可以访问哪些功能的许可(证书)----让系统知道你能做什么?? 2 常见 ...

  10. EL和JSTL表达式学习记录

    EL.JSTL表达式EL:1.EL使用目的:代替jsp页面中java脚本编写 2.EL作用:(1)从域中取出数据(最重要)(2)EL的内置对象(11个)(3)EL可以执行表达式运算 JSTL(JSP标 ...