fix(promotion merch detail): 修复商品详情页下拉错位问题并添加商品描述省略
1. 添加商品描述文本的多行省略显示样式 2. 动态计算顶部header高度替代固定值,解决页面滚动错位问题 3. 监听merch数据变化重新计算头部高度
This commit is contained in:
@@ -23,6 +23,7 @@
|
||||
<text class="icox icox-xing"></text>
|
||||
<text class="icox icox-xing"></text>
|
||||
</view>
|
||||
<view style="overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;">{{ merch.desc }}</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
@@ -58,7 +59,7 @@
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<mescroll-uni top="240" ref="mescroll" @getData="getGoodsList">
|
||||
<mescroll-uni :top="headerHeight" ref="mescroll" @getData="getGoodsList">
|
||||
<block slot="list">
|
||||
<view class="goods-list single-column" :class="{ show: isList }">
|
||||
<view class="goods-item margin-bottom" v-for="(item, index) in goodsList" :key="index"
|
||||
@@ -319,9 +320,37 @@ import list from './public/js/list.js';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {};
|
||||
return {
|
||||
headerHeight: 320,
|
||||
screenWidth: uni.getSystemInfoSync().windowWidth
|
||||
};
|
||||
},
|
||||
mixins: [list]
|
||||
mixins: [list],
|
||||
watch: {
|
||||
merch: {
|
||||
handler() {
|
||||
this.$nextTick(() => {
|
||||
this.initHeaderHeight();
|
||||
});
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
initHeaderHeight() {
|
||||
setTimeout(() => {
|
||||
const query = uni.createSelectorQuery().in(this);
|
||||
query.select('.head-wrap').boundingClientRect(rect => {
|
||||
if (rect) {
|
||||
this.headerHeight = (rect.height / this.screenWidth) * 750;
|
||||
}
|
||||
}).exec();
|
||||
}, 100);
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.initHeaderHeight();
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user