Route va Query parametrlari

Route ga parametr uzatish

🏑 Dynamic content bilan ishlash davomida route’ga parametr berib yuborish odatiy hol hisoblanadi. Masalan, foydalanuvchilarning sahifalari, mahsulotning sahifasi, blog post’lar va h.k. Parametrlar berilgan URL’ning bir qismi hisoblanadi va component ichida olish imkoniyati mavjud.

Route param bilan ishlash qadamlari

1. Parametrga ega bo’lgan route’larni yaratish - route’larda param borligini :paramName orqali ko’rsatib ketish mumkun

<Route path="/users/:id" element={<UserProfile />} />

2. Component ichida route param’ni olish - react-router-dom ning maxsus useParams() funksiyasidan foydalanib route paramni component ichida olish imkoniyati mavjud

import { useParams } from 'react-router-dom';

function UserProfile() { const { id } = useParams(); // get route param return <h1>User ID: {id}</h1>; }

3. Route’ga parametr bilan o’tish - aniqlab olingan route’ga param bilan o’tish uchun, biz ko’rsatib o’tgan route param o’rniga kerakli qiymatlar qo’yiladi

import { Link } from 'react-router-dom'; function UserList() { return ( <div> <Link to="/profile/123">Go to User 123's Profile</Li </div

);

}