catalog

Topshiriq "paginate product list" tayyorlash

Ro'yhatda elementlar bir xil bittasini tanlab olamiz va kerakli propertylarni aniqlab olamiz. Ko'rinib turgan image, brand_title, title, price va ko'rinmayotgan product_id, product_slug route bilan productni tanlash uchun muhim propertylar hisoblanadi.

{
  "data": [
    {
      "id": 45,
      "slug": "razer-blade-15-gaming-laptop",
      "title": "Razer Blade 15 Gaming Laptop",
      "price": "23000000",
      "thumbnail": "https://api.markt.circle.uz/storage/78/conversions/razer-thumbnail.jpg",
      "brand": {
        "id": 6,
        "slug": "razer",
        "title": "razer"
      },
      "tags": [
        {
          "id": 1,
          "slug": "new",
          "type": "tags",
          "title": "new"
        }
      ]
    },
    {
      "id": 46,
      "slug": "msi-raider-ge76-gaming-laptop",
      "title": "MSI Raider GE76 Gaming Laptop",
      "price": "13000000",
      "thumbnail": "https://api.markt.circle.uz/storage/80/conversions/msi-thumbnail.jpg",
      "brand": {
        "id": 6,
        "slug": "razer",
        "title": "razer"
      },
      "tags": [
        {
          "id": 1,
          "slug": "new",
          "type": "tags",
          "title": "new"
        }
      ]
    }
  ],
  "links": {
    "first": "https://api.markt.circle.uz/api/v1/products?page=1",
    "last": "https://api.markt.circle.uz/api/v1/products?page=1",
    "prev": null,
    "next": null
  },
  "meta": {
    "current_page": 1,
    "from": 1,
    "last_page": 1,
    "links": [
      {
        "url": null,
        "label": "« Previous",
        "active": false
      },
      {
        "url": "https://api.markt.circle.uz/api/v1/products?page=1",
        "label": "1",
        "active": true
      },
      {
        "url": null,
        "label": "Next »",
        "active": false
      }
    ],
    "path": "https://api.markt.circle.uz/api/v1/products",
    "per_page": 20,
    "to": 2,
    "total": 2
  }
}

Ahamiyat berishimiz mumkinki pul birligi mavjud project da. Yuqoridagi rasmda so'm, va header qismida currency uchun selector o'rnatilgan. yechim oddiy database uchun asosiy birlik tanlab olanadi. va tashqi bozor bilan ishlovchi api bilan real live pul birliklariga exchange qilish mumkin. Bizni holatda

{
  "data": {
    "USD": 1,
    "RUB": 90.7063,
    "UZS": 12566.4489
  }
}

Biz tayyorlagan malumotlar orqali client osongina hisoblashi mumkin.

List tayyor bo'ldi. Keyingi ish bu list orqali filter qilish, tanlangan category, tag yoki brand bo'yicha yoki barchasi bo'yicha birdaniga

Bu vazifani sodda usulda yechish mumkin. get request da params dan foydalangan holda shunday qilingan bizning holatda.