<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. c++树的表示方法

    c++树的节点的表示方法: typedef struct Node *Tree; struct Node { int data; Node *left; Node *right; int flag; ...

  2. linux 命令——8 cp (转)

    cp 命令用来复制文件或者目录,是Linux系统中最常用的命令之一.一般情况下,shell会设置一个别名,在命令行下复制文件时,如果目标文件已经存在, 就会询问是否覆盖,不管你是否使用-i参数.但是如 ...

  3. select into outfile

    语法格式如下: SELECT [列名] FROM table [WHERE 语句]         INTO OUTFILE '目标文件' [OPTION];   FIELDS TERMINATED ...

  4. hdu-1198 Farm Irrigation---并查集+模拟(附测试数据)

    题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=1198 题目大意: 有如上图11种土地块,块中的绿色线条为土地块中修好的水渠,现在一片土地由上述的各种 ...

  5. 【51nod1299】监狱逃离(树形DP)

    点此看题面 大致题意: 在一棵树中有\(N\)条边连接\(N+1\)个节点,现在已知这棵树上的\(M\)个节点,要求封住最少的节点,使这\(M\)个节点中的任意一个节点无法到达叶子节点,若能办到输出最 ...

  6. [solr 管理界面] - 索引数据删除

    删除solr索引数据,使用XML有两种写法: 1) <delete><id>1</id></delete> <commit/> 2) < ...

  7. LuceneTest

    /** * Created by mhm on 2019/6/24. */@RunWith(SpringJUnit4ClassRunner.class)public class LuceneTest ...

  8. getchar输入多行字符,原格式输出(包含换行符)

    #include<stdio.h> int main() { FILE fp; ]; ; char ch; while((ch=getchar())!=EOF){ str[k++]=ch; ...

  9. SAP事件 Event Flow(转载)

    1 报表过程事件 报表过程事件是在报表运行过程中由系统自动控制,按照一定次序被触发的事件,其目的是从数据库中选择数据并整理,准备进行列表输出.这些事件从报表程序启动开始就被系统顺序触发,现分述如下: ...

  10. Android中级教程之Android应用程序的生命周期

    Android应用程序的生命周期图 在大部分情况下,每个Android应用都将运行在自己的Linux进程中.当这个应用的某些代码需要执行时,进程就会被创建,并且将保持运行,直到该进程不再需要,而系统需 ...