I'm trying to get the height of the window on resize, but I keep getting the error ReferenceError: calcOfSliderHeight is not defined.
Could anyone let me know what's going on? Here's my code
let example = new Vue({
el: '#example',
data() {
return {
pageIndex: 2,
posTop: 0,
posTop2: 0,
}
},
methods: {
calcOfSliderHeight() {
let _this = this;
_this.posTop = (_this.pageIndex - 1) * window.innerHeight
},
calcOfSliderHeight2() {
let _this = this;
_this.posTop2 = (_this.pageIndex - 3) * window.innerHeight
},
},
mounted: function() {
let _this = this;
window.addEventListener('resize', function() {
calcOfSliderHeight()
calcOfSliderHeight2()
});
_this.posTop = calcOfSliderHeight();
_this.posTop2 = calcOfSliderHeight2();
}
});
You need to call calcOfSliderHeight with this keyword, so it would be:
window.addEventListener('resize', () => {
this.calcOfSliderHeight()
this.calcOfSliderHeight2()
});
Ref: https://vuejs.org/guide/essentials/reactivity-fundamentals.html#declaring-methods