Mily wants to fetch the list of product data from a backend API. Received data will be set as the state of a component i.e. in 'result'. Which of the following code snippets will help her in achieving this requirement? (Assume all required set up is given) const[result,setResult] = useState("") axios.get(“api_url”).subscribe(res => setResult(result)) axios.fetch(“api_url”).then(res => setResult({result : res})) axios.get(“api_url”).then(res => setResult(res.data) ) axios.fetch(“api_url”).then(res => setResult(res.data))

Jack has created a React application that contains the CourseList component with state courses as shown below.const CourseList = () => { const [courses,setCourses] = useState([ ]) const [success, setSuccess] = useState('')}He wants to retrieve the list of courses available for registration from the database within the CourseList component. He wants the courses data to be rendered immediately when the component is rendered. Which of the following code snippet helps Jack to achieve the above requirement?useEffect(() => { // asynchronous call },[]);useEffect(() => { // asynchronous call },[courses]);useEffect(() => { // asynchronous call },[courses,success]);useEffect(() => { // asynchronous call },[success]);

What will be the output of the following code snippet?import React, { useState, useEffect } from "react";import axios from "axios";function App() { const [users, setUsers] = useState([]); const [loading, setLoading] = useState(true); useEffect(() => {   async function getUsers() {     const result = await axios.get("https://jsonplaceholder.typicode.com/users");     setUsers(result.data);     setLoading(false);   }   getUsers(); }, []); return (   <div>     {loading ? (       <div>Loading...</div>     ) : (       users.map((user) => <div key={user.id}>{user.name}</div>)     )}   </div> );}export default App;AIt will display the list of users fetched from the APIBIt will throw an errorCIt will display a loading spinnerDIt will not display anything

Which of the following is a preferrable way to send a GET request in react?Aconst App = () => {const fetchHandler = () => {  fetch('randomapi').then(res => {console.log(res)}) }fetchHandler();return <div></div>}Bconst fetchHandler = () => {  fetch('randomapi').then(res => {console.log(res)}) }const App = () => {fetchHandler();return <div></div>}Cconst App = () => {useEffect(() => {const fetchHandler = () => {  fetch('randomapi').then(res => {console.log(res)}) }fetchHandler();}, []);return <div></div>}DNone of the above

fetch() returns a Promise that resolves to the Response to that request, whether it is successful or not.

Which of the following is a valid way to use theuseEffect()hook to fetch data from an API?AuseEffect(() => { const fetchData = async () => {   const response = await fetch('https://api.example.com');   const data = await response.json();   setData(data); }; fetchData();}, []);BuseEffect(() => { fetch('https://api.example.com')   .then(response => response.json())   .then(data => setData(data));}, []);CBoth a and bDNeither a nor b