Commit 8576c3d2 by 李嘉林

商品列表轮播加高度

parent d7247042
...@@ -70,12 +70,7 @@ const componentOptions = { ...@@ -70,12 +70,7 @@ const componentOptions = {
clientHeight: 0, //窗口高度 clientHeight: 0, //窗口高度
swipeInfo: [], swipeInfo: [],
currentSwiperIndex: 0, currentSwiperIndex: 0,
swiperTypeHeightList: { swiperHeight: 0,
1: "510px",
2: "300px",
3: "256px",
4: "220px",
}
}, },
// 数据监听器 // 数据监听器
observers: {}, observers: {},
...@@ -184,6 +179,7 @@ const componentOptions = { ...@@ -184,6 +179,7 @@ const componentOptions = {
} }
}, },
init() { init() {
let _this = this;
let { let {
goodsType, goodsType,
goodsSource, goodsSource,
...@@ -228,6 +224,14 @@ const componentOptions = { ...@@ -228,6 +224,14 @@ const componentOptions = {
} }
} }
this.getSwipeLen(); this.getSwipeLen();
wx.createSelectorQuery().selectAll(`.goodsListItemIndex${this.data.datasIndex}>>>.goods-item`).boundingClientRect(function (rects) {
console.log(rects[0], '--rects', _this.data.datasIndex)
if (rects[0] && rects[0].height) {
_this.setData({
swiperHeight: rects[0].height
})
}
}).exec();
}, },
handleSwipeChange(e) { handleSwipeChange(e) {
this.setData({ currentSwiperIndex: e.detail.current }) this.setData({ currentSwiperIndex: e.detail.current })
......
...@@ -150,11 +150,11 @@ ...@@ -150,11 +150,11 @@
<heap-item datas="{{datas}}"></heap-item> <heap-item datas="{{datas}}"></heap-item>
</view> </view>
<!-- 轮播滑动 --> <!-- 轮播滑动 -->
<view wx:if="{{datas.componentData.style === 'swipe'}}" style="position:relative;"> <view wx:if="{{datas.componentData.style === 'swipe' && datas.componentData.goodsList.length > 0}}" style="position:relative;">
<swiper bindchange="handleSwipeChange" style="height: {{swiperTypeHeightList[datas.componentData.columnNum]}}"> <swiper bindchange="handleSwipeChange" style="height: {{swiperHeight}}px">
<block wx:for="{{swipeInfo}}"> <block wx:for="{{swipeInfo}}">
<swiper-item> <swiper-item>
<view style="display: grid;gap:{{datas.componentData.proGap*2}}rpx;grid-template-columns:repeat({{datas.componentData.columnNum}}, 1fr)"> <view class="goods-item" style="display: grid;gap:{{datas.componentData.proGap*2}}rpx;grid-template-columns:repeat({{datas.componentData.columnNum}}, 1fr)">
<view wx:for="{{item}}" wx:for-index="indey"> <view wx:for="{{item}}" wx:for-index="indey">
<goods-item <goods-item
datas="{{datas}}" datas="{{datas}}"
...@@ -166,7 +166,7 @@ ...@@ -166,7 +166,7 @@
</swiper-item> </swiper-item>
</block> </block>
</swiper> </swiper>
<view class="flex custom-indicator"> <view class="flex custom-indicator" wx:if="{{swiperHeight > 0}}">
<block wx:for="{{swipeInfo}}"> <block wx:for="{{swipeInfo}}">
<view class="custom-indicator__item {{currentSwiperIndex === index && 'custom-indicator__active'}}"></view> <view class="custom-indicator__item {{currentSwiperIndex === index && 'custom-indicator__active'}}"></view>
</block> </block>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment