What are some examples of the state pattern in React?

What are some examples of the state pattern in React?

The state pattern in React is often implemented using hooks or class components. For example, using the useState hook to manage local component state.

Can you give me a specific code example?

Sure! Here's a simple example:

import React, { useState } from 'react';

const Counter = () => {
  const [count, setCount] = useState(0);

  return (
    <div>
      <p>Count: {count}</p>
      <button onClick={() => setCount(count + 1)}>Increment</button>
    </div>
  );
};

This component uses the state pattern to manage the count.

What about using class components?

In class components, you can use the state property like this:

import React, { Component } from 'react';

class Counter extends Component {
  constructor(props) {
    super(props);
    this.state = { count: 0 };
  }

  increment = () => {
    this.setState({ count: this.state.count + 1 });
  };

  render() {
    return (
      <div>
        <p>Count: {this.state.count}</p>
        <button onClick={this.increment}>Increment</button>
      </div>
    );
  }
}

This is another way to implement the state pattern.