使用 Axios 过滤 response.data 的 API 调用

Question

我想获得最新的 8 款产品，具体取决于产品的日期。我可以获取整个产品数组并对其进行过滤，如下所示：

    const newestProducts= [];
    axios.get("http://localhost:3003/products").then(response => {
        let products = response.data.sort(function(a, b) {
            return new Date(b.date) - new Date(a.date);
        });

        newstProducts = product.slice(0,7)
    });

但如果我有数千种产品，那就太糟糕了，我只需要获得最新的 8 种产品

我想过在通话中添加?_limit=8

axios.get("http://localhost:3003/products?_limit=8").then{...}

但这也不能正常工作，因为它让我获得了数组中唯一的前 8 个产品

有什么方法可以在我从服务器获取产品之前对其进行过滤，或者我必须将它们全部存储在 var 中然后过滤它们

Json 文件

      "categories": [ 
            {
            "id": 9,
            "category": "bathroom",
            "date": "2020/8/3",
            "name": "ullam basin mixer",
            "price": 160,
            "img_1": "rim_mixer_01.jpg",
            "img_2": "rim_mixer_02.jpg",
            "rating": 4.5,
            "description": "MARMO is a complete series made of 72 models, with different shapes and sizes for different functions, that keeps uncompromised its elegant beauty. This is a Demo Online Store."
        },
        {
            "id": 10,
            "category": "bathroom",
            "date": "2020/8/19",
            "name": "gravida bathtub",
            "price": 2100,
            "img_1": "inbani_bathtub_01.jpg",
            "img_2": "inbani_bathtub_02.jpg",
            "rating": 4,
            "description": "A young company with a wealth of experience. created in 2004, inbani has evolved into a leader in innovation thanks to a conviction to create products which truly benefit the well-being of the customer.  This is a Demo Online Store. No orders shall be fulfilled."
        },
        {
            "id": 11,
            "category": "bathroom",
            "date": "2020/9/9",
            "name": "vulputate mixer",
            "price": 300,
            "img_1": "marmo_mixer_01.jpg",
            "img_2": "marmo_mixer_02.jpg",
            "description": "MARMO is a complete series made of 72 models, with different shapes and sizes for different functions, that keeps uncompromised its elegant beauty. This is a Demo Online Store."
        },
        {
            "id": 12,
            "category": "bathroom",
            "date": "2018/7/17",
            "name": "aliquam veneatis bathtub",
            "price": 2580,
            "img_1": "sa_oche_01.jpg",
            "img_2": "sa_oche_02.jpg",
            "description": "Its oval, elliptical design with the incongruent walls invokes an avant-garde atmosphere in the bathroom."
        },
        {
            "id": 13,
            "category": "kitchen",
            "date": "2020/3/13",
            "name": "quisque teapot",
            "price": 240,
            "img_1": "theo_teapot_01.jpg",
            "img_2": "theo_teapot_02.jpg",
            "description": "Theo Teapot is a Scandinavian-Japanese teapot made from stoneware and bamboo, designed by Unit 10 Design for Stelton.  This is a Demo Online Store. No orders shall be fulfilled."
        },
        {
            "id": 14,
            "category": "kitchen",
            "date": "2020/2/12",
            "name": "creamic teapot",
            "price": 60,
            "img_1": "cer_teapot_01.jpg",
            "img_2": "cer_teapot_02.jpg",
            "rating": 3.9,
            "description": "Matte ceramic tea pot comes with integrated and removable metal tea infuser. Capacity 700 ml (2.96 cups). Dishwasher safe. This ceramic teapot has a white matte finish, coupled with a square shape and curved lines."
        },
        {
            "id": 15,
            "category": "kitchen",
            "date": "2019/2/1",
            "name": "bottle grinders",
            "price": 30,
            "img_1": "bottle_gringer_01.jpg",
            "img_2": "bottle_gringer_02.jpg",
            "rating": 4.8,
            "description": "Bottle Grinders is a minimal, timeless salt and pepper mill set designed by Norm.Architects for Menu. Steering away from the predictable grinder, the Norm Bottle Grinder is not what you expect to see in a salt and pepper grinder. The form, shaped more like a bottle, cleverly tricks the user to encourage a more playful and experimental interaction with the product. This is a Demo Online Store. No orders shall be fulfilled. Purchase this product"
        },
        {
            "id": 16,
            "category": "lighting",
            "date": "2020/1/3",
            "name": "commodo blown lamp",
            "price": 275,
            "img_1": "tradition_blown_01.jpg",
            "img_2": "tradition_blown_02.jpg",
            "description": "Blown lamp SW3 & SW4 by &tradition is a mouth-blown pendant lamp with a quilted pattern, it comes in a translucent variant with a silver lustre or in a opal white version. Blown lamp is fitted with a powder-coated metal suspension. This is a Demo Online Store. No orders shall be fulfilled."
        },
        {
            "id": 17,
            "category": "lighting",
            "date": "2020/6/9",
            "name": "spot table",
            "price": 100,
            "img_1": "spot_lamp_01.jpg",
            "img_2": "spot_lamp_02.jpg",
            "rating": 3.4,
            "description": "Set the stage. The Spot lamp is a lively, versatile addition to your room. This is a Demo Online Store. No orders shall be fulfilled."
        }
    ]

Answer 1

问题不在于 API 调用...要提高性能，您必须在后端重构 DATABASE REQUEST 以仅获取最后 8 个产品。 笔记： 您可以通过发送到后端控制器 (ROUTE) 中的数据库的查询来完成此操作