導入的React.Component不使用Typescript進行渲染

Question

在App.tsx中，我正在導入CounterComponent.tsx，如果CounterComponent正在導出函數而不是React類，則導入有效。

如果你想要克隆/重現，這是提交： https ： //github.com/Falieson/react15-meteor1.5/commit/d06ebc80c4b75850338c9a2cf11cf3ec49cafa40

謝謝您的幫助

App.tsx

import * as React from 'react';
import Counter from './counter/CounterComponent'

const App = (
  <div className='app-container'>
    {Counter}
  </div>
)
export default App

CounterComponent.tsx

import * as React from 'react'

class CounterModule extends React.Component<{}, {}> {
  public render() {
    return (
      <div>
        Counter Module Placeholder
      </div>
    )
  }
}

export default CounterModule

Answer 1

在React中，當你想渲染一些元素時，你應該使用<Element /> 。 所以改變

const App = (
  <div className='app-container'>
    {Counter}
  </div>
)

至

const App = (
  <div className='app-container'>
    <Counter/>
  </div>
)