React/TypeScript: extending a component with additional properties

Question

I am trying to use react to recreate my currents components (written in pure typescript) but I can\'t find a way to give additional props to a component extending an other.

Answer 1

For those who need, base classes can declare required/abstract methods that all instances must implement:

import { Component } from 'react'


abstract class TestComponent
 extends Component {
  abstract test(): string
}


type Props = {
  first: string,
  last: string,
}

type State = {
  fullName: string,
}

class MyTest extends TestComponent {
  constructor(props: Props) {
    super(props)
    this.state = {
      fullName: `${props.first} ${props.last}`
    }
  }

  test() {
    const { fullName } = this.state
    return fullName
  }
}