sending props from parent to child code example

Example 1: how to pass props from child to parent

class ToDoList extends React.Component {    constructor(props) {        super(props);        this.state = {            listDataFromChild: null        };        },    myCallback = (dataFromChild) => {        this.setState({ listDataFromChild: dataFromChild });    },    otherFn = () => {        [...within this other function now I still have access to this.state.listDataFromChild...]    }    render() {        return (            <div>                 <ToDoItem callbackFromParent={this.myCallback}/>                 [...now here I can pass this.state.listDataFromChild as a prop to any other child component...]                   </div>        );    }});

Example 2: pass props from parent to child react functional component

import React, { useState } from 'react';
import './App.css';
import Todo from './components/Todo'



function App() {
    const [todos, setTodos] = useState([
        {
          id: 1,
          title: 'This is first list'
        },
        {
          id: 2,
          title: 'This is second list'
        },
        {
          id: 3,
          title: 'This is third list'
        },
    ]);

return (
        <div className="App">
            <h1></h1>
            <Todo todos={todos}/> //This is how i'm passing props in parent component
        </div>
    );
}

export default App;


function Todo(props) {
    return (
        <div>
            {props.todos.map(todo => { // using props in child component and looping
                return (
                    <h1>{todo.title}</h1>
                )
            })}
        </div>  
    );
}