在Laravel中如何在一个接口中实现首页查询10条数据和分页查询5条数据？

Laravel高效实现首页加载10条和分页加载5条数据

本文介绍如何在单个Laravel接口中实现移动端文章列表的双重加载需求：首页加载10条数据，后续分页加载每次5条数据。

业务场景

移动端文章列表接口需要满足以下条件：

• 首次加载显示10篇文章。
• 用户下拉刷新或上拉加载更多时，每次加载5篇文章。

实现方案

无需创建两个独立接口，一个接口即可满足需求。关键在于灵活处理前端传递的参数。

1. 首次加载 (首页):

   前端请求接口时，传递per_page=10和page=1参数。

2. 分页加载:

   用户触发加载更多时，前端传递per_page=5，并将page参数递增。

Laravel代码实现

public function getArticles(Request $request)
{
    $perPage = $request->input('per_page', 10); // 默认10
    $page = $request->input('page', 1);       // 默认1

    $articles = Article::paginate($perPage, ['*'], 'page', $page);

    return response()->json($articles);
}

前端请求示例 (使用axios)

首次加载:

axios.get('/api/articles', {
    params: {
        per_page: 10,
        page: 1
    }
})
.then(response => {
    // 处理数据
});

分页加载 (假设当前页码为currentPage)

axios.get('/api/articles', {
    params: {
        per_page: 5,
        page: currentPage + 1
    }
})
.then(response => {
    // 处理数据，更新currentPage
});

通过paginate方法，Laravel优雅地处理分页逻辑。 前端通过控制per_page和page参数，轻松实现首页加载和分页加载的不同数据数量。 此方法简洁高效，避免了冗余代码，提高了接口的可维护性。