// 32是两个字体(16px)的宽度。tab中字数不同的话怎么调整以下代码... that.setData({ sliderLeft: (res.windowWidth / that.data.tabs.length - 32) / 2, sliderOffsets: tempArr, sliderOffset: 0, itemWidth: itemWidth, windowWidth: windowWidth });
时间: 2024-02-14 07:15:21 浏览: 54
如果tab中字数不同,可以根据实际的字体宽度来计算下划线的宽度。假设tab中的字体大小为16px,可以按照以下代码进行修改:
```javascript
// 计算每个tab的宽度
var tempArr = [];
var itemWidth = 0;
var windowWidth = wx.getSystemInfoSync().windowWidth;
for (var i = 0; i < that.data.tabs.length; i++) {
var query = wx.createSelectorQuery().in(that);
query.select('#tab-' + i).boundingClientRect();
query.exec(function(res) {
tempArr.push(res[0].left);
itemWidth = res[0].width + 32; // 加上32px的间距
that.setData({
itemWidth: itemWidth
});
});
}
that.setData({
sliderLeft: (windowWidth / that.data.tabs.length - that.data.itemWidth) / 2,
sliderOffsets: tempArr,
sliderOffset: 0,
windowWidth: windowWidth
});
```
以上代码中,使用了 `wx.createSelectorQuery()` API 来获取每个tab的宽度,然后根据实际宽度计算下划线的宽度。其中 `itemWidth` 变量表示每个tab的宽度,根据实际情况计算即可。
阅读全文