I want to link input and h1, and the console says that I'm not using a function, what's wrong in the code?

Question

React

I want to link input and h1 so that when you write something, the title changes.

// Компонент родитель через которого я передаю значение от одного ребенка к другому

class Container extends React.Component{
      constructor(props) {
      super(props);
      this.state = {
        title: "Hello World"
      };
    };
      setTitle = (text) => {
        if(text!=null)
          this.setState ({ title: text});
      }
      render(){
        return (
          <div className="container">
            <Constructor_template titlename={ this.state.title } />
            <Ready_template updatetitle={ this.setTitle } />
          </div>
        );
      }
    }

//Дочерний компонент с input
class Constructor_template extends React.Component{
      update = () =>{
    this.props.updatetitle(this.refs.text.value);
  	  }
    
      render(){
        return (
          <form action="" className="constructor-template">

            <div className="name-template">
              <h2>Введите название шаблона</h2>
              <input type="text" ref="text" onChange={this.update}></input>
            </div>

            <input type="submit" value="Сохранить шаблон"></input>

          </form>
        );
      }
    }

//Дочерний компонент с h1
class Ready_template extends React.Component{
      render(){
        return (
          <div className="ready-template" >
            <form className="interview-container" >
            
              <h1>{this.props.titlename}</h1>

              <input type="submit"></input>

            </form>
          </div>
        );
      }
    }

Answer 1

Well, you mixed up the components. You pass titlename to Constructor_template, but you need to pass updatetitle. And vice versa - you pass updatetitle to Ready_template, but you need to pass titlename.