小程序 自定义 今日头条 nav bar 且nav-item不定宽（踩坑）

小程序 自定义 今日头条 nav bar 且nav-item不定宽（踩坑）

getDomInfo(nth) {
var that = this;
//获取所有节点的宽，作为left 递增
//注意以下选择 元素的坑， 每次点击 它会获取 最新的 left值 （而且它触发了两次）
//所以不如 干脆保存第一次的值 所有元素的宽 （累加当前点击，所有左边兄弟元素的宽，注意有没有box-sizing，它获取的width不包含padding）
//减去100 是为了它能在左边展示出来 100px
wx.createSelectorQuery().selectAll(’.my-tabs-title’).boundingClientRect(function (rects) {
if (that.data.firstRects.length == 0) {
// console.log(rects, ‘第一次rects’)
let itemleft = 0;
for (var i = 0; i < rects.length; i++) {
if (i < nth) {
itemleft +=(rects[i].width+20)
}
}
that.setData({
activeLeft: itemleft-100,
firstRects: rects //保存最初的位置
})
console.log(itemleft)
} else if (that.data.firstRects.length > 0) {
// console.log(that.data.firstRects,‘第22次rects’);
let itemleft = 0;
for (var i = 0; i < that.data.firstRects.length; i++) {
if (i <nth) {
itemleft += (that.data.firstRects[i].width+20)
}
}
that.setData({
activeLeft: itemleft-100
})
}

}).exec();

},