javascript - 如何防止网页无限加载相同的元素?
问题描述
我只想显示一次电影,但是在它们被安装后,onScroll 方法会重复,尽管有 removeEventListener。onScroll 方法为bottomOfWindow 设置布尔值。
if (bottomOfWindow) {
this.nextMovieIds.forEach((movieId) => {
axios
.get("http://www.omdbapi.com/?i=" + movieId + "&apikey=2cbab1d9&")
.then((response) => {
this.$store.dispatch("addMovie", { movie: response.data });
})
.catch((err) => {
console.log(err);
});
});
}
mounted() {
this.$nextTick(function () {
window.addEventListener("scroll", this.onScroll);
this.onScroll();
});
if (this.$store.state.movies.length < 7) {
this.nextMovieIds = [
"tt0317919",
"tt0298203",
"tt0410097",
"tt1057500",
"tt0120591",
"tt1504320",
];
} else {
this.nextMovieIds = [];
}
},
beforeUnmount() {
window.removeEventListener("scroll", this.onScroll);
}
解决方案
推荐阅读
- php - Laravel - Eloquent to Json,然后对 json 对象进行 sortBy 不起作用
- .net-core - 从 dotnet 核心控制台应用程序运行外部 exe 文件
- css - 相同宽度之前的 CSS
- c - C - How to resolve a segmentation fault while freeing the pointer after the function call?
- arrays - 如何在 SwiftUI 自定义结构中显示数组中的下一项?
- amazon-web-services - AWS:通过负载均衡器或服务中任务中指定的公共 IP 访问应用程序
- java - 无法在 Android 10 中从意图打开文件
- memory-management - “__GFP_NOFAIL”和“__GFP_REPEAT”有什么区别?
- angular - 我应该如何在 asp .net core API 中返回错误
- java - 找不到符号、JUnit、枚举方法