Tutorial by Examples

State in React components is essential to manage and communicate data in your application. It is represented as a JavaScript object and has component level scope, it can be thought of as the private data of your component. In the example below we are defining some initial state in the constructor f...

The primary way that you make UI updates to your React applications is through a call to the setState() function. This function will perform a shallow merge between the new state that you provide and the previous state, and will trigger a re-render of your component and all decedents. Parameters ...

You should not save props into state. It is considered an anti-pattern. For example: export default class MyComponent extends React.Component { constructor() { super(); this.state = { url: '' } this.onChange = this.onChange.bind(this); ...

Here's an example of a React component with a "managed" input field. Whenever the value of the input field changes, an event handler is called which updates the state of the component with the new value of the input field. The call to setState in the event handler will trigger a call to ...