带有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 添加到call中

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调用..。为了提高性能，您必须在后端折射数据库请求，才能得到最后8个产品。注意:您可以通过发送到后端控制器(路由)中的数据库的查询来完成此操作。