How to pass value and functions from one component to another in function components in React-CodePudding

I want to pass the value written in input field to app component and show it in h1 tag

You can refer to this sandbox I have attached. I have already tried passing function as prop but it doesn't help.

CodePudding user response：

You can pass any data as a props in react component. Components and props in React

Example :

function Welcome(props) {
  return <h1>Hello, {props.name}</h1>;
}

function App() {
  return (
    <div>
      <Welcome name="Sara" />
      <Welcome name="Cahal" />
      <Welcome name="Edite" />
    </div>
  );
}

ReactDOM.render(
  <App />,
  document.getElementById('root')
);

In your component It's typo mistake.

Use props.onChange insted of props.handleChange