Как использовать компоненты React с определёнными параметрами с помощью TS?

Question

[Георгий Кузнецов]

Допустим есть такой компонент React формата tsx:

export const Comp = (a: string) => {
    <div>
        <h1> {a} </h1>
    </div>
}

Как такой компонент (передавая в него нужный параметр) использовать в коде по типу такого (так же tsx):

import {Component} from 'react';
import './Main.css';

class Main extends Component {
    render () {
        return(
            <div className="Main">
                
            </div>
        );
    }
}

export default Main;

Comments

[WbICHA]

Как такой компонент (передавая в него нужный параметр) использовать в коде по типу такого

Точно так же. В чём вообще вопрос заключается?

[Mikhail Osher]

Прежде чем задавать вопросы тут, внимательно ознакомьтесь в документацией. Выучите и поймите основные штуки, типа props/render/reconcillation.

Answer 1

[Aetae]

export const Comp = (a: string) => {
    <div>
        <h1> {a} </h1>
    </div>
}

Это не компонент react. У react-копонента первым аргументом всегда приходят readonly объект props. Там не может быть строки.