Contents

React boilerplates

Komponenty State i Stateless

Parent przekazuje stan do Child i renderuje Child. Child renderuje stan otrzymany z Parent

Parent

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
# react component
import React from 'react'
import ReactDOM from 'react-dom'
import {Child} from './Child'


class Parent extends React.Component {
  constructor(props) {
    super(props);
    this.state = { name: 'Value' };
  }

  render() {
    return <Child name={this.state.name} />;
  }
}

ReactDOM.render(
  <Parent />,
  document.getElementById('app')
)

Child

1
2
3
4
5
6
7
import React from 'react';

export class Child extends React.Component {
  render() {
    return <h1>Hey, my name is {this.props.name}!</h1>;
  }
};