update
This commit is contained in:
parent
24cb57ea15
commit
a1dbd94d25
@ -3,7 +3,7 @@
|
||||
<view class="digital-dashboard">
|
||||
<!-- Tab切换区域 -->
|
||||
<scroll-view scroll-x class="tab-container" :scroll-with-animation="true" :scroll-left="tabScrollPosition"
|
||||
show-scrollbar="false">
|
||||
show-scrollbar="false" :scroll-animation-duration="300">
|
||||
<view class="tab-list">
|
||||
<view v-for="(tab, index) in tabList" :key="index" :id="`tab-${index}`" class="tab-item"
|
||||
:class="{ active: activeTab === index }" @click="switchTab(index)">
|
||||
@ -379,8 +379,27 @@ export default {
|
||||
this.updateTabScrollPosition(current);
|
||||
},
|
||||
updateTabScrollPosition(index) {
|
||||
const avgTabWidth = 100;
|
||||
this.tabScrollPosition = index * avgTabWidth;
|
||||
setTimeout(() => {
|
||||
const query = uni.createSelectorQuery().in(this)
|
||||
query.select('.tab-container').boundingClientRect()
|
||||
query.select(`#tab-${index}`).boundingClientRect()
|
||||
|
||||
query.exec((res) => {
|
||||
if (!res || res.length < 2 || !res[0] || !res[1]) {
|
||||
const estimatedWidth = 120
|
||||
this.tabScrollPosition = Math.max(0, (index - 1) * estimatedWidth)
|
||||
return
|
||||
}
|
||||
|
||||
const container = res[0]
|
||||
const tab = res[1]
|
||||
const tabCenter = tab.left + (tab.width / 2)
|
||||
const containerCenter = container.left + (container.width / 2)
|
||||
const scrollOffset = tabCenter - containerCenter
|
||||
const newScrollPosition = Math.round(this.tabScrollPosition + scrollOffset)
|
||||
this.tabScrollPosition = Math.max(0, newScrollPosition)
|
||||
})
|
||||
}, 100)
|
||||
},
|
||||
|
||||
// 滚动到指定组件
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user