typescript nicht abfangen Typ nicht übereinstimmen (reagieren TSX)

Question

TypScript & Reagieren Neuling hier. Warum schreit TypeScript mich nicht an? constructor(foo: string) Eingangstyp stimmt nicht überein {foo: string}? (Hinweis: Einer von ihnen ist ein String, der andere ein Objekt.)

TypeScript wird dies gerne kompilieren, und natürlich wird der resultierende Code explodieren. Ich habe versucht, alle Optionen zu aktivieren, die tsconfig.json zu bieten hat. Ich benutze Typoskript 2.5.3.

Gibt es eine Möglichkeit, wie Typoskript-Konfiguration, Code ändern oder irgendetwas anderes, um den Code zu verhärten, um dies zu vermeiden? Irgendwelche Ideen geschätzt, ist mein Ziel, stabilen Code zu schreiben.

Import * als Reaktion von 'reagieren'; Import * als ReactDOM von 'react-dom';

class App extends React.Component<{ foo: string }, { foo: string }> { 
    // expects string 
    constructor(foo: string) { 
     super(); 
     this.state = { 
      foo: foo 
     } 
    } 
    render() { 
     return <div>{this.state.foo}</div> 
    } 
} 

// Passes object { foo: string } 
ReactDOM.render(<App foo="foo" />, document.getElementById('root')) 

EDIT: vereinfachte Frage

Answer 1

Sie Ich werde die Compilerbeschwerden bekommen, nach denen du suchst wenn Sie daran denken, die props an super() zu übergeben. Dies ist nur ein Teil React.Component von erstreckt, und should always be done.

Answer 2

Ihr Anliegen:

// WRONG, to work, it should be: 
// constructor(props Props) { 
constructor(foo: string, bar: string) { 
    super(); 
} 

ist ungültig, weil man immer eine Klasse erben können und Ihren eigenen Konstruktor bieten:

class A { 
    constructor(a: number) { } 
} 

class B extends A { 
    // ALLOWED 
    constructor(b: string) { 
    super(123) 
    } 
}