function NameList(props) {    const myLists = props.myLists;    const listItems = myLists.map((myList) =>      <li>{myList}</li>    );    return (      <div>          <h2>Rendering Lists inside component</h2>                <ul>{listItems}</ul>      </div>    );  }  const myLists = ['Peter', 'Sachin', 'Kevin', 'Dhoni', 'Alisa'];   ReactDOM.render(    <NameList myLists={myLists} />,    document.getElementById('app')  );  export default App;

import React from 'react';import ReactDOM from 'react-dom/client';const myArray = ['apple', 'banana', 'orange'];const myList = myArray.map((item) => <p>{item}</p>)const container = document.getElementById('root');const root = ReactDOM.createRoot(container);root.render(myList);

react, Props are used to send data from one component to another, a team of developers created a Student component having properties that are: Name, roll number, College, GPA Now, these properties are needed to be used in another component, bypassing props, finding the valid syntax the team must use, so all of them render and display only the value in separated lines on screen- A function Student(props) { return ( <> <div> (props.Name}<div/> <div>{props.RollNumber} <div/> <div>{props.College}<div/> <div> (props.GPA)<div/> </>); } B function Student(props) { return ( <> <div className="props.Name"><div/> <div className="props.RollNumber"><div/> <div className="props.College"><div/> <div className="props.GPA"><div/> </>); }

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]);

Charles added the below line of code inside ReactDOM.render() method as follows:<TodoList items={data}>Which of the following options can be used to access the property 'items' in the component TodoList? [select two options]const TodoList = (props) =>{ return ( <h1>{props.items}</h1> ) }const TodoList = ({items}) =>{ return ( <h1>{items}</h1> ) }const TodoList = (props) =>{ return ( <h1>{this.props.items}</h1> ) }const TodoList = ({items}) =>{ return ( <h1>{this.items}</h1> ) }

Fill in the blank: When rendering a list in React, each item in the list must have a ______.1 pointunique valueunique dataunique key