the-road-to-learn-react / React Alternative Class Component Syntax
An alternative/future way of React Class Component with Class Field Declarations
Stars: ✭ 57
Programming Languages
javascript
184084 projects - #8 most used programming language
react-alternative-class-component-syntax
React Class Components can be made much more concise using the class field declarations. You can initialize local state without using the constructor and declare class methods by using arrow functions without the extra need to bind them.
class Counter extends Component {
state = { value: 0 };
handleIncrement = () => {
this.setState(prevState => ({
value: prevState.value + 1
}));
};
handleDecrement = () => {
this.setState(prevState => ({
value: prevState.value - 1
}));
};
render() {
return (
<div>
{this.state.value}
<button onClick={this.handleIncrement}>+</button>
<button onClick={this.handleDecrement}>-</button>
</div>
)
}
}
Installation
git clone [email protected]:the-road-to-learn-react/react-alternative-class-component-syntax.git
- cd react-alternative-class-component-syntax
- npm install
- npm start
- visit
http://localhost:8080
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].