Component

Components

Components are the blocks of an app. Here is an introduction to the idea of components:

Component Factory

The simplest way to define a component is to write a function like this:

function Greeting(props) {
    return <h1>Hi, {props.target}!</h1>;
}

A component factory receives props and returns an element. Component factories are usually used to create simple components.

Component Class

You can also use a class to define a component:

class Greeting extends HEle.Component {
    render() {
        return <h1>Hi, {this.props.target}!</h1>;
    }
}

Class components are usually used to create complex components because they have something special.

Tips

• Use component factories for simple components that only need props (and maybe contexts).
• Use composition to reuse code between components instead of inheritance.