ООП + React + typescript как правильно создавать компоненты?

Question

[ElizarBatin]

Есть ли какие либо примеры view компонентов которые были написаны при помощи typescript с использованием ООП?

Answer 1

[Антон Спирин]

Я так пишу:

import * as React from 'react';
import { connect, DispatchProp } from 'react-redux';
import { connectedPropSelector } from './selectors';

interface OwnProps {
  ownProp: string,
}

interface ConnectedProps {
  connectedProp: string,
}

type Props = OwnProps & ConnectedProps & DispatchProp<any>;

interface State {
  someKey: string,
}

class Example extends React.Component<Props, State> {
  state = {
    someKey: 'someValue',
  };
  
  render() {
    const { ownProp, connectedProp } = this.props;

    return ( /* ... */ );
  }
}

const mapStateToProps = state => ({
  connectedProp: connectedPropSelector(state),
});

export default connect(mapStateToProps)(Example);

Официальная документация

Comments

[ElizarBatin]

Спасибо