8. Komponentide hierarhia

Reacti komponent saab väljastada e renderdada teiste komponentide sisu, selliselt tekib komponentide hierarhia. Komponent sisaldab teisi komponente. Allolevas näites on nn konteinerkomponent App ja alamkompomnent Vidin.

import React from 'react';
// Vanemkomponent
class App extends React.Component {
  constructor() {
    super();
    this.state = {
      txt: 'see on state tekst'
    }
  }
  update(e) {
    this.setState({txt: e.target.value})
  }
  render() {
    return (
      <div>
        <h1>Ho-hoo, {this.state.txt}.</h1>
        <Vidin update={this.update.bind(this)} />
      </div>
    )
  }
}
// lapskomponent
const Vidin = (props) => //Stateless function component
<input type="text" onChange={props.update} />
export default App