uniapp设置商品参数（循环输入框并获取到每个的值）demo

<template>
	<view>
		<view class="top">商品型号及价格设置（每款至少有一个型号）</view>
		<view class="tiajia" @click="tiajia()">
			添加
		</view>
		<view class="tiajia" @click="shanchu()">
			删除
		</view>
		<view class="centrerW">
			
		
		<view class="center1" v-for="(item1,index1) in dataList1" :key="index1" >
        <view class="title_right">
          <span class="titles">商品原价</span>
          <input type="text" placeholder="请输入价格" v-model="item1.origin_price" value="item1.origin_price"/>
        </view>

        <view class="title_right">
          <span class="titles">商品活动价</span>
          <input type="text" placeholder="请输入活动价格" v-model="item1.active_price" value="item1.active_price"/>
        </view>

        <view class="title_right">
          <span class="titles">库存</span>
          <input type="text" placeholder="请输入库存" v-model="item1.product_stock" value="item1.product_stock"/>
        </view>

        <view class="title_right">
          <span class="titles">商品规格</span>
          <input type="text" placeholder="请输入商品规格" v-model="item1.product_specs" value="item1.product_specs"/>
        </view>
        
        <view class="title_right">
          <span class="titles">商品规格</span>
          <input type="text" placeholder="请输入商品规格" v-model="item1.product_model" value="item1.product_model"/>
        </view>

        <view class="title_right">
          <span class="titles">商品重量</span>
          <input type="text" placeholder="请输入重量" v-model="item1.product_weight" value="item1.product_weight"/>
        </view>
    </view>
	</view>

		<view class="bottom">
			<view class="suoyou">
				所有型号
			</view>
			<view class="baocun" @click="baocun()">
				保存
			</view>
		</view>


	</view>



</template>

<script>
	export default {
		data() {
			return {
				dataList1:[
          {
            origin_price:'',
            active_price:'',
            product_stock:'',
            product_specs:'',
            product_model:'',
            product_weight:''
          }
        ],

				index1:1,
				inputValue:[],
			}
		},
    onShow() {
      let me=this;
    },
		methods: {
      input1(e){
        console.log(e.currentTarget.dataset.id);
        console.log(e);
      },
			bindPickerChange(e){
			  let a = e.target.value
			  this.indexlb = a
			  console.log(e)
			  // console.log(store)
			  console.log(this.kuaidi)
			},
			jian(){
				if(this.number == 0){
					uni.showToast({
						duration:2000,
						title:'重量不能小于0',
						icon:'none',
					})
					this.number = 0
				}else{
					this.number -= 1
				}

			},
			jia(){
				if(this.number == 99){
					uni.showToast({
						duration:2000,
						title:'重量不能大于99',
						icon:'none',
					})
					this.number = 99
				}else{
					this.number += 1
				}

			},
			//点击添加按钮  向数组内添加数据
			tiajia(){
        let obj={origin_price:'',
            active_price:'',
            product_stock:'',
            product_specs:'',
            product_model:'',
            product_weight:''};
				this.dataList1.push(obj);
        console.log(this.dataList1.length)
			},
			//删除按钮   删除dataLi1数组内最后一个元素
			shanchu(){
				this.dataList1.pop()
			},
			// 获取input的值
			baocun(){

				let me = this

				console.log(me.dataList1)
			},
			changeText(e){

				console.log(e.target)
			}
		}
	}
</script>

<style lang="scss">
	.top{
		line-height:80rpx;
		text-align: center;
		font-size:24rpx;
		color:#333;
	}
	.center1{
		width:90%;
		margin:0 auto;
		background: #FFFFFF;
		border-radius: 10rpx;
		padding:0 10rpx;
		margin-bottom:30rpx;
	}
	.centrerW .center1:nth-last-child(1){
		margin-bottom:110rpx;
	}
	.title_right{
		width:100%;
		height:80rpx;
		line-height: 80rpx;
	}
	.title_right span{
		float:left;
		width:200rpx;
		height:80rpx;
		line-height: 80rpx;
	}
	.title_right input{
		float:left;
		width: calc(100% - 200rpx);
		border-bottom:1px solid #808080;
		height:70rpx;
		line-height: 70rpx;
		text-align: right;
	}
	.btom1{
		width:100%;
		height:80rpx;
		line-height:80rpx;
	}
	.btom1 span{
		float:left;
		width:200rpx;
		height:80rpx;
		line-height: 80rpx;
	}
	.right {
		float:left;
	  // width: 85%;
	  width:calc(100% - 200rpx);
	  color: #A8A8A8;
	  font-size: 28upx;
	  display: flex;
	  margin-top: 6rpx;
	  text-align: right;
		border-bottom:1px solid #808080;
	  .picker {
	    margin-left: 10upx;
	    margin-right: 10upx;
	  }

	  .arrow_down {
	    display: inline-block;
	    width: 0;
	    height: 0;
	    border-left: 8upx solid transparent;
	    border-right: 8upx solid transparent;
	    border-top: 8upx solid #A8A8A8;
	    margin-left: 10upx;
	  }
	}
	.btom2{
		width: 100%;
		height:80rpx;
		line-height: 80rpx;
	}
	.btom2 span{
		width:270rpx;
		height:80rpx;
		line-height: 80rpx;
		float:left;
	}
	.btom2_gj{
		width:calc(100% - 270rpx);
		float:right;
		display:flex;
	}
	.btom2_gj view,.btom2_gj input{
		flex:1;
		width:100rpx;
		hieght:80rpx;
		text-align: center;
	}
	.bottom{
		position: fixed;
		bottom:0;
		width:100%;
		height:80rpx;
		line-height:80rpx;
		display:flex;
		background: #fff;
		z-index:10
	}
	.bottom view{
		flex:1;
		text-align: center;
		line-height: 80rpx;
	}
	.bottom .baocun{
		background:#ff0;
	}
</style>