Q15.webp

Kizspy | Question: 15
(Choose 1 answer)
Create a React component that uses the Suspense component to display a fallback while loading a lazily
loaded component. Which code snippet is correct?
A. import React, {lazy, Suspense } from 'react';
const MyComponent = lazy (() => import("./MyComponent'));
function App() { return ( <Suspense fallback={<div>Loading...</div>}> <MyComponent/> </Suspense> ); }
export default App;
B. import React, {Suspense } from 'react';
const MyComponent import("./MyComponent');
function App() { return ( <Suspense fallback={<div>Loading...</div>}> <MyComponent/> </Suspense> ); }
export default App;
C. import React, {lazy } from 'react';
const MyComponent = lazy('./MyComponent');
function App() { return ( <div fallback={<div>Loading...</div>}> <MyComponent /> </div> ); }
export default App;
D. import React from 'react';
const MyComponent = React.lazy (() => import("./MyComponent'));
function App() { return ( <React.Suspense> <MyComponent /> </React.Suspense> ); }
export default App;