how to use intersectionobserver api in vuejs
<template>
<img :src="srcImage" />
</template>
<script>
export default {
props: ['src'],
data: () => ({ observer: null, intersected: false }),
computed: {
srcImage() {
return this.intersected ? this.src : '';
}
},
mounted() {
this.observer = new IntersectionObserver(entries => {
const image = entries[0];
if (image.isIntersecting) {
this.intersected = true;
this.observer.disconnect();
}
});
this.observer.observe(this.$el);
},
destroyed() {
this.observer.disconnect();
}
}
</script>
Are there any code examples left?
New code examples in category Javascript
-
Javascript 2023-04-21 22:52:36
-
Javascript 2022-03-27 22:25:20 javascript download string as file
-
Javascript 2022-03-27 21:40:22 sort numbers in array javascript
-
Javascript 2022-03-27 21:20:04 compare two arrays and return the difference javascript
-
Javascript 2022-03-27 21:15:02 javascript regex french phone number
-
Javascript 2022-03-27 21:05:03 cypress custom error message
-
Javascript 2022-03-27 21:00:05 create element javascript with id
-
Javascript 2022-03-27 20:40:57 feather icons react
-
Javascript 2022-03-27 20:20:01 how to make graphql request in axios
-
Javascript 2022-03-27 20:15:07 bootstrap validator password and confirm password