Преобразование расширенного класса компонентов React для работы с машинописным текстом

Question

В настоящее время я пытаюсь преобразовать проект из реакции в машинописный текст.

Итак, в настоящее время у меня есть файл jsx, который я хочу преобразовать в tsx, и его код выглядит следующим образом: Мне интересно, какими будут первые шаги, мне нужно создать реквизит, верно?

props = {onClick: } // But what would it be? {}?

Спасибо

Answer 1

рад, что вы адаптируете Typescript в своем проекте :)

При использовании Typescript в React вы должны сделать что-то вроде ниже:

type ButtonProps = {
  // Function props is typed as (arg: ArgumentType) => ReturnType.
  // `event` is the argument type for the function.
  // `void` is the return type of the function.
  onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void
}

// Class component.
class Button extends React.Component<ButtonProps> {
  render() {
    return (
      <button onClick={this.props.onClick} />
    )
  }
}

// Function component.
const Button: React.FC<ButtonProps> = ({ onClick }) => {
  return (
    <button onClick={onClick} />
  )
}

Надеюсь, это проясняет, как вводить компонент React с Typescript .