代码片段:<view class="price_box_item"> <block v-for="(item,index) in priceData" :key="index" > <view class="item_con bg-image" :style="{'background-image':url(${OSSImgUrl}/images/20230403_newApp/box/offline_price_item_bg.png)}" @tap.stop="onSelectPrice(item, index)" > <view class="price_1">¥</view> <view class="price_2">{{item.price / 100}}</view> <image class="price_active" :src="${OSSImgUrl}/images/20230403_newApp/box/price_active.png" v-if="selectedPriceCode == item.priceCode" ></image> </view> </block> </view><!-- 支付组件 --> <confirm-order ref="offlinePay" :payData="payData" payType="offline" @onPay="onPay" ></confirm-order>// 支付组件 import ConfirmOrder from '@/components/confirm-order/confirm-order.vue';// 选择价位 onSelectPrice(item, index){ var that = this; uni.$u.throttle( ()=> { if(item.priceCode == this.selectedPriceCode) return this.selectedPriceCode = item.priceCode; this.payData.price = item.price / 100; console.log('this.payData.price', index) this.priceIndex = index; this.payData.name = item.price / 100 + '元双盲盒大礼包' },1000) }, 怎么通过选择不同的价位,选择对应的优惠券,优惠券在支付组件中,以下是组件中的优惠券代码片段:async mounted() { this.getAddressList(); this.getCouponList1(); }, computed:{ discountPrice(){ //优惠金额 let selectedCoupon = this.selectedCoupon; let price = this.payData.price; if(selectedCoupon.type === 1){ //折扣 return (price * ((100 - selectedCoupon.discount) / 100)).toFixed(2) }else if(selectedCoupon.type === 2){ //满减 return (selectedCoupon.subPrice / 100).toFixed(2) }else{ return 0.00 } } },
时间: 2024-02-23 11:59:03 浏览: 52
根据代码片段,可以看到在组件中添加了一个名为 `getCouponList1` 的方法,这个方法应该是用来获取优惠券列表的。可以在 `onSelectPrice()` 方法中调用这个方法来获取对应的优惠券列表。同时,在支付组件中,可以定义一个名为 `selectedCoupon` 的变量,用来存储用户选择的优惠券。当用户选择优惠券之后,可以将该优惠券信息存储在 `selectedCoupon` 变量中,并在计算优惠金额时使用。
修改后的代码可能如下所示:
```
// 选择价位
onSelectPrice(item, index){
var that = this;
uni.$u.throttle( ()=> {
if(item.priceCode == this.selectedPriceCode) return
this.selectedPriceCode = item.priceCode;
this.payData.price = item.price / 100;
console.log('this.payData.price', index)
this.priceIndex = index;
this.payData.name = item.price / 100 + '元双盲盒大礼包'
// 获取对应的优惠券列表
this.getCouponList1();
},1000)
},
// 支付组件
<confirm-order ref="offlinePay" :payData="payData" payType="offline" @onPay="onPay" ></confirm-order>
// 组件中的优惠券代码片段
async mounted() {
this.getAddressList();
this.getCouponList1();
// 定义变量来存储用户选择的优惠券
this.selectedCoupon = null;
},
computed:{
discountPrice(){ //优惠金额
let selectedCoupon = this.selectedCoupon;
let price = this.payData.price;
if(selectedCoupon.type === 1){ //折扣
return (price * ((100 - selectedCoupon.discount) / 100)).toFixed(2)
}else if(selectedCoupon.type === 2){ //满减
return (selectedCoupon.subPrice / 100).toFixed(2)
}else{
return 0.00
}
}
},
```
需要注意的是,在获取优惠券列表后,还需要将列表展示给用户,让用户选择相应的优惠券。选择优惠券后,需要将选中的优惠券信息存储在 `selectedCoupon` 变量中。同时,在计算优惠金额时需要使用该变量中存储的优惠券信息。
阅读全文