- Courses
- Tutorials
- Practice
- Jobs
React Router
Question 1
Which of the following routers uses the HTML5 History API?
HashRouter
BrowserRouter
MemoryRouter
FileRouter
Question 2
Which of the following is NOT a feature of React Router?
- A
Declarative Routing
- B
Dynamic Routing
- C
Server-side rendering
- D
Nested Routes
Question 3
Which of the following is true about React Router?
- A
It only works with class components
- B
It provides a BrowserRouter component for client-side routing
- C
It doesn't support nested routes
- D
It requires Redux for routing functionality
Question 4
Which component is used to declare individual routes in React Router?
- A
<NavLink>
- B
<Route>
- C
<Link>
- D
<BrowserRouter>
Question 5
In the following example, what will useParams() return?
<Route path="/product/:id" element={<Product />} />
- A
A function to navigate between products
- B
An object containing { id: "productId" }
- C
A string with the product id
- D
The complete URL path
Question 6
In which environment would you typically use MemoryRouter in React Router?
- A
In production environments with dynamic routes
- B
In testing or non-browser environment
- C
When managing browser history
- D
For static web applications
Question 7
What is the main benefit of nested routes in React Router?
- A
They allow routing based on query parameters.
- B
They enable routing with custom URL hashes.
- C
They make routing simpler and support hierarchical and complex structures.
- D
They replace the use of useNavigate().
Question 8
What is the correct syntax to pass parameters in a dynamic route like /page/:id?
- A
<Route path="/page" element={<Page />} />
- B
<Route path="/page/:id" element={<Page />} />
- C
<Route path="/page" params={{id}} />
- D
<Route path="/page" element={<Page id />} />
Question 9
In the Product component, which of the following is the correct way to access the productId from the URL?
- A
const { id } = useParams();
- B
const { productId } = useParams();
- C
const { product } = useParams();
- D
const { productId } = useLocation();
Question 10
What happens when the following code is executed in a React Router v6 application?
const navigate = useNavigate();
navigate('/about', { replace: true });
- A
Navigates to /about and replaces the history entry
- B
Navigates to /about and adds a new history entry
- C
Causes a page refresh
- D
Logs an error
There are 10 questions to complete.
