更简洁/优雅的方式来连接 fetch() 返回的 JSON 元素

Posted 2023-02-19

【中文标题】更简洁/优雅的方式来连接 fetch() 返回的 JSON 元素

【英文标题】：More Concise/Elegant Way to Concat JSON Elements Returned by fetch()

【发布时间】：2022-01-22 01:46:51

【问题描述】：

我目前正在使用 REST 从 WordPress 获取类别。 100 个限制迫使我进行多个查询。这是我目前的功能。这不漂亮。谁能想出更简洁的东西？

export async function getAllCategories() 
    let arr = []
    const res = await fetch(`$API_URLwp/v2/categories?per_page=100&page=1`)
    const data = await res.json()
    const totalPages = res.headers.get("X-WP-TotalPages")
    data.forEach((el) => 
        arr.push(el)
    )
    let i = 2
    while (i <= totalPages) 
        const res = await fetch(`$API_URLwp/v2/categories?per_page=100&page=$i`)
        const data = await res.json()
        data.forEach((el) => 
            arr.push(el)
        )
        i++
    
    return arr

【参考方案1】：

您可以定义一个辅助函数 getCategories，它检索特定页面的类别和页面总数。 这将删除 fetch 调用重复。 此外，您可以使用扩展运算符来避免 forEach 循环来填充结果数组：

export async function getAllCategories() 
    let result = []
    let page = 1;
    let totalPages = 0;
    do  
        const  data, total  = await getCategories(page);
        result.push(...data)
        totalPages = total
        page++
     while (page <= totalPages);
    return result


const getCategories = async (page) => 
    const res = await fetch(`$API_URLwp/v2/categories?per_page=100&page=$page`)
    return 
        data: await res.json(),
        total: res.headers.get("X-WP-TotalPages")