Why is the React component not working?

Question

React

Hello. Started learning React. I ran into a small error. It is necessary that when data is entered in Input, the title, which is located in another component, changes, but this does not happen. I don't understand why.

Here is the heading

import React from "react";
import "./App.scss";
import Input from "../Input/Input.js";

class App extends React.Component {
  state = {
    title: "hello",
  };

  render() {
    return (
      <div className="container">
        <h1 className="title">{this.state.title}</h1>
        <Input />
      </div>
    );
  }
}

export default App;

here we enter Input

import React from "react";
import "./Input.scss";

class Input extends React.Component {
  handleInput = (event) => {
    this.setState({
      title: event.target.value,
    });
  
  };

  render() {
    return (
      <div className="fieldWrapper">
        <input onChange={this.handleInput} className="fieldWrapper__textArea"></input>
      </div>
    );
  }
}

export default Input;

Answer 1

Update the state of the child component instead of the parent.
It is necessary to transfer the handleInput method to the parent component and pass it to the child: In the child, accordingly, get it not directly from the current instance, but from props:
<Input handleInput={this.handleInput} />
onChange={this.props.handleInput}