created() {
this.$nextTick(() => {
this.InitTabScroll()
})
},
methods: {
InitTabScroll() {
// 两个0.3表示左右padding,动态计算子元素tabWrapper的宽度
const width = 0.28 + 0.28 + 2.6 * this.posterList.length + (this.posterList.length - 1) * 0.2
// for (let i = 0; i < this.itemList.length; i++) {
// width += this.$refs.tabitem[0].getBoundingClientRect().width // getBoundingClientRect() 返回元素的大小及其相对于视口的位置
// }
this.$refs.tabWrapper.style.width = width + ‘rem‘
this.$nextTick(() => {
if (!this.scroll) {
this.scroll = new BScroll(this.$refs.tab, {
startX: 0,
click: true,
scrollX: true, // 横向滚动
scrollY: false, // 纵向滚动
eventPassthrough: ‘vertical‘
})
} else {
this.scroll.refresh()
}
})
},