Is there a cleaner/better way to write this Contact Manager in React?
Don't add extra properties to the component for things that belong in state.  Delete this.people because you already have this.state.people.  Move i into state.
Of course if you do that you cannot use mutating operations like ++ and .push() so you need to make a few changes.  When you are setting a state based on a previous state it is a best practice to use an update function to get the current state which ensures that you always have the most recent value.
You can do this:
this.setState({ people: this.state.people.concat(newPerson) });

But it's better to do this:
this.setState(prevState =&gt; ({ people: prevState.people.concat(newPerson) }));

The common code convention in JavaScript is to use camelCase for functions and class methods.  So use addPerson, removeElement, etc.
You want to be able to clear the inputs when you add a contact.  In order to do that, your &lt;input&gt; elements need to be controlled components which get their value from state.
Revised Code:
import React, { Component } from &quot;react&quot;;

export default function App() {
  return (
    &lt;div className=&quot;container&quot;&gt;
      &lt;h1 className=&quot;title&quot;&gt;React Contact Manager&lt;/h1&gt;

      &lt;Content /&gt;
    &lt;/div&gt;
  );
}

class Content extends Component {
  state = {
    people: [],
    name: &quot;&quot;,
    age: &quot;&quot;,
    telephone: &quot;&quot;,
    searchTerm: &quot;&quot;,
    id: 0,
  };

  getName = (e) =&gt; {
    this.setState({ name: e.target.value });
  };
  getAge = (e) =&gt; {
    this.setState({ age: e.target.value });
  };
  getTelephone = (e) =&gt; {
    this.setState({ telephone: e.target.value });
  };
  getSearchTerm = (e) =&gt; {
    this.setState({ searchTerm: e.target.value });
  };

  addPerson = () =&gt; {
    this.setState(state =&gt; ({ 
      // clear inputs
      name: &quot;&quot;,
      age: &quot;&quot;,
      telephone: &quot;&quot;,
      // increment id
      id: state.id + 1,
      // add person
      people: state.people.concat({
        id: state.id,
        name: state.name,
        age: state.age,
        telephone: state.telephone,
      })
    }));
  };

  removeElement = (id) =&gt; {
    this.setState( state =&gt; ({
      people: state.people.filter((person) =&gt; person.id !== id)
    }));
  };

  clearItems = () =&gt; {
    this.setState({ people: [] });
  };

  render() {
    return (
      &lt;div className=&quot;content&quot;&gt;
        &lt;div className=&quot;inputs&quot;&gt;
          &lt;input
            type=&quot;text&quot;
            placeholder=&quot;Name&quot;
            className=&quot;fname&quot;
            value={this.state.name}
            onChange={this.getName}
          /&gt;
          &lt;input
            type=&quot;number&quot;
            placeholder=&quot;Age&quot;
            className=&quot;age&quot;
            value={this.state.age}
            onChange={this.getAge}
          /&gt;
          &lt;input
            type=&quot;tel&quot;
            placeholder=&quot;Telephone Number&quot;
            className=&quot;telephone&quot;
            value={this.state.telephone}
            onChange={this.getTelephone}
          /&gt;
        &lt;/div&gt;

        &lt;div className=&quot;buttons&quot;&gt;
          &lt;button className=&quot;add&quot; onClick={this.addPerson}&gt;
            Add
          &lt;/button&gt;
        &lt;/div&gt;

        &lt;ul className=&quot;result&quot;&gt;
          {(this.state.people || []).map((person) =&gt; (
            &lt;li key={person.id}&gt;
              &lt;div className=&quot;values&quot;&gt;
                {person.name + &quot;, &quot; + person.age}
                &lt;span className=&quot;telephone_span&quot;&gt;{person.telephone}&lt;/span&gt;
              &lt;/div&gt;
              &lt;button
                className=&quot;delete&quot;
                onClick={() =&gt; this.removeElement(person.id)}
              &gt;
                Remove
              &lt;/button&gt;
            &lt;/li&gt;
          ))}
        &lt;/ul&gt;
        &lt;button className=&quot;clear&quot; onClick={this.clearItems}&gt;
          Clear
        &lt;/button&gt;
      &lt;/div&gt;
    );
  }
}