不多说,直接代码,以便以后重复利用:
= height1 && this.scrollY < height2)) {
return i;
};
}
return 0;
}
},created() {
this.classMap = ['decrease','discount','special','invoice','guarantee'];
this.$http.get('/api/goods').then((response) => {
response = response.body;
if (response.errno === ERR_OK) {
this.goods = response.data;
this.$nextTick(() => {
this._initScroll();
this._calculateHeight();
});
}
});
},methods: {
_initScroll() {
this.menuScroll = new BScroll(this.$refs.menuwrapper,{
click: true
});
this.foodScroll = new BScroll(this.$refs.foodswrapper,{
probeType: 3
});
this.foodScroll.on('scroll',(pos) => {
this.scrollY = Math.abs(Math.round(pos.y));
});
},_calculateHeight() {
let foodList = this.$refs.foodswrapper.getElementsByClassName('food-list-hook');
let height = 0;
this.listHeight.push(height);
for (let i = 0; i < foodList.length; i++) {
let item = foodList[i];
height += item.clientHeight;
this.listHeight.push(height);
}
},selectMenu(index,event) {
if (!event._constructed) {
return;
};
console.log(index);
let foodList = this.$refs.foodswrapper.getElementsByClassName('food-list-hook');
let el = foodList[index];
this.foodScroll.scrollToElement(el,300);
}
}
};
以上所述是小编给大家介绍的vue2.0中goods选购栏滚动算法的实现代码。编程之家 jb51.cc 收集整理的教程希望能对你有所帮助,如果觉得编程之家不错,可分享给好友!感谢支持。
原文链接:https://www.f2er.com/vue/39257.html