Stateless Components From Stateful Components
Learn React programming patterns for mixing components with and without state.
Start
Key Concepts
Review core concepts you need to learn to master this subject
Stateful and Stateless Components
React Programming Pattern
Changing Props and State
Passing State Change Functions as Props
Event Handlers and State in React
Using Stateless Updaters and Presenters
Stateful and Stateless Components
Stateful and Stateless Components
class Store extends React.Component {
constructor(props) {
super(props);
this.state = { sell: 'anything' };
}
render() {
return <h1>I'm selling {this.state.sell}.</h1>;
}
}
class Week extends React.Component {
render() {
return <h1>Today is {this.props.day}!</h1>;
}
}In React, a stateful component is a component that holds some state. Stateless components, by contrast, have no state. Note that both types of components can use props.
In the example, there are two React components. The Store component is stateful and the Week component is stateless.
What you'll create
Portfolio projects that showcase your new skills
How you'll master it
Stress-test your knowledge with quizzes that help commit syntax to memory
Stateless Components From Stateful Components
Start