php - 在 laravel 中对数据数组进行分页并在 vuejs 中使用无限滚动的最佳方法
问题描述
请有人帮助我,我有一个数据数组(该数组包含登录用户的帖子和登录用户朋友的帖子:也就是说,如果我登录,它将获取我的帖子和我的朋友的帖子) ,这个数组获取所有帖子,所以如果我有 100 个朋友并且我的每个朋友都有 30 个帖子,我将获取 300 个帖子,我想对获取的数据进行分页并从数组中获取 5 个帖子,当用户滚动时获取更多在页面下方我使用 laravel 和 vuejs 来显示数据,请问什么是实现这一点的最佳方法,检查我已经编写的代码
public function feeds()
{
$friends = Auth::user()->friends();
$feed = array();
foreach ($friends as $friend):
foreach ($friend->posts as $post):
array_push($feed, $post);
endforeach;
endforeach;
foreach (Auth::user()->posts as $post):
array_push($feed, $post);
endforeach;
usort($feed, function($p1, $p2){
return $p1->id < $p2->id;
});
return $feed;
}
Vue.js
get_feed()
{
this.loading = true;
axios.get('/feed').then((response) => {
this.loading = true;
response.data.forEach((post) => {
this.$store.commit('add_post', post)
this.loading = false;
})
})
}
computed: {
posts() {
return this.$store.getters.all_posts
},
}
解决方案
这里有一个更快的版本来检索帖子。
public function feeds(){
$userdIds = Auth::user()->friends()->pluck('id')->toArray();
$userIds[] = Auth::id();
$feed = Post::whereIn('user_id', $userIds)->orderBy('id', 'desc')->paginate(10);
return $feed;
}
推荐阅读
- angular - 使用 Angular 7 通过按钮增加字体大小
- c# - services.AddSingleton
.NET Core 中的用途 - azure - Azure Devops Rest API - 找出特定代理池上的队列作业
- java - Vert.x:在不丢弃新消息的情况下处理 Rabbitmq 消费者背压
- java - “android”命令已弃用。苹果系统
- android - 单个 Cordova 项目中的多个 Cordova 应用程序
- javascript - 如何从字母表中选择字母显示该字母的文本?香草 Javascript
- cassandra - 启动 Cassandra 3.11.2 时遇到错误
- sql - 点燃数据库时间戳列默认为当前时间戳失败
- angular - 如何确定线性进度条的持续时间