Hello guys, i have following code
<template>
<ion-page>
<ion-content :scroll-events="true" @ionScroll="pullAnimation" class="ion-padding">
<div v-for="i in 60" :key="i">
<h1>dsadasdsad</h1>
</div>
</ion-content>
</ion-page>
</template>
<script>
import { IonContent, IonPage } from '@ionic/vue';
export default {
components: {
IonContent,
IonPage,
},
setup() {
const pullAnimation = () => {
alert('das');
};
return {
pullAnimation,
};
},
};
</script>
This generates alert when i scroll on chrome. But when i scroll on my phone nothing show, its like event isnt even fired up.
you must bind the $event with any scroll like:
@ionScrollStart=“functionStart($event)”
@ionScroll=“functionScroll($event)”
@ionScrollEnd=“functionEnd($event)”
which single function in setup:
const functionStart = (e) => {
console.log('scroll start: ', e);
}
const functionScroll = (e) => {
console.log('scroll: ', e);
}
const functionEnd = (e) => {
console.log('scroll end: ', e)
}
return {
functionStart, functionScroll, functionEnd
}
Doesnt work, same on my android phone it is not working. I didnt use console.log i used alert and still it didnt show when i was scrolling on the phone :/.
You try set alert on IonScroll and set conditional for it like:
if(e.target.currentY > 50 || e.target.pageYOffset > 50 ) {
alert('You current scroll from Y: ', e)
}
just because you don’t give scroll any condition, that why when u scroll will not showing anything. Try to make some condition when u scroll the document.
not working, these values are undefined and if never passes. I just did if(e) {code} and still nothing. I think thats not it.
@usanzadunje , try it on below:
and then this setup will like this:
for me it working!
Not working again. It could be because of my stupid phone? I have some Huawei but its really old.
I tested on friends phone but cannot remember if this worked ,will try it again and give info if its because of phone.
What this means? I didnt withdraw…