reactjs - 获取“JSX 元素类型‘App’没有任何构造或调用签名。” 导出 JSX 元素数组时出现 ts(2604) 错误

Question

我有一个返回 JSX 元素数组的函数。当我将其传递给ReactDOM.render我时，我收到了上述错误。

wrappers.tsx

const FooterWithStore:React.FC = () => (
    <Provider store={store}>
      <FooterLangWrapper />
    </Provider>
)

const AppWithStore:React.FC = () => (
    <Provider store={store}>
      <LangWrapper />
    </Provider>
);

const WrapFooter = (WrappedComponent: React.FC) => [
    <WrappedComponent key="1" />,
    <FooterWithStore key="2" />
]

const App = WrapFooter(AppWithStore)
export default App

index.tsx

ReactDOM.render(
  <App />,
  document.getElementById('root')
);

Answer 1

试试这个解决方案

const FooterWithStore:React.FC = () => (
    <Provider store={store}>
      <FooterLangWrapper />
    </Provider>
)

const AppWithStore:React.FC = () => (
    <Provider store={store}>
      <LangWrapper />
    </Provider>
);

const WrapFooter = (WrappedComponent: React.FC) => () => [
    <WrappedComponent key="1" />,
    <FooterWithStore key="2" />
]

const App = WrapFooter(AppWithStore)
export default App

您需要返回该函数，并且App常量包含调用后形成的对象WrapFooter。因此，您只需要使用一个闭包，以便在范围内WrappedComponent可用。WrapFooter