How do I create a class component in React with TypeScript?

How do I create a class component in React with TypeScript?

To create a class component in React with TypeScript, you can extend the React.Component class and define your props and state types.

Can you show me a simple example?

Sure! Here's a basic example:

import React from 'react';

interface MyComponentProps {
  name: string;
}

interface MyComponentState {
  count: number;
}

class MyComponent extends React.Component<MyComponentProps, MyComponentState> {
  constructor(props: MyComponentProps) {
    super(props);
    this.state = { count: 0 };
  }

  render() {
    return <div>Hello, {this.props.name}! Count: {this.state.count}</div>;
  }
}

export default MyComponent;

What if I want to add lifecycle methods?

You can add lifecycle methods like componentDidMount, componentDidUpdate, and componentWillUnmount directly in your class. For example:

componentDidMount() {
  console.log('Component mounted!');
}

Is there a way to manage state without using class components?

Yes! You can use functional components with hooks like useState and useEffect for state management.