商品详情页实现价格区间价

…内容我实在是不想说了太恶心了直接上代码吧
html:

// 商品详情页区间价
	<view class="istyle-layout-lr ">
		// 默认选择sku
		<view class="price fz-44 weight blue" wx:if="{{is_sku}}">{{goods_price}}</view>
		// 多个sku展示效果
		<view class="price fz-44 weight blue" wx:if="{{!is_sku && goods_price_area.length>1}}">￥{{goods_price_area[0]}}-{{goods_price_area[goods_price_area.length-1]}}</view>
		// 是一个sku就展示一个
		<view class="price fz-44 weight blue" wx:if="{{!is_sku && goods_price_area.length==1}}">￥{{goods_price_area[0]}}</view>
	</view>

// 点击加入购物车弹框
	<view class="product-pri">
		// 默认选择sku
		<text class="blue" wx:if="{{is_sku}}">￥{{goods_price}}</text>
		// 多个sku展示效果
		<view class="blue" wx:if="{{!is_sku && goods_price_area.length>1}}">￥{{goods_price_area[0]}}-{{goods_price_area[goods_price_area.length-1]}}</view>
		// 是一个sku就展示一个
		<view class="blue" wx:if="{{!is_sku && goods_price_area.length==1}}">￥{{goods_price_area[0]}}</view>
		<text class="fz-30 c-666">库存：{{goods_stock}}件</text>
		<text wx:if="{{goods_info.common_spec_value}}" class="fz-30 c-666">请选择规格</text>
	</view>

js:

data:{
	is_sku: false,//是否选择sku
},
onLoad:function(e){
	let arr = Object.values(res.data.data.price_list); // 拿到数据中的规格，是一个对象需转换为数据取出里边所有的值
    arr.sort(function(x,y){return (x-y);});// 因为是区间价所以要对这个数组进行排序从小到大
    this.setData({
		goods_price_area: arr, // goods_price_area展示页面中的进行排序
	})
},
spec_change: function (e) {
     this.setData({
          is_sku: true
     })
 }

效果：