전역 JSX 네임스페이스가 더 이상 사용되지 않을 때 JSX.Element의 올바른 반환 유형 대체는 무엇입니까?

Question

@types/react 中，全局 JSX 네임스페이스는 더 이상 사용되지 않습니다:

으아악

ESLint의 deprecation/deprecation 规则（来自插件 eslint-plugin-deprecation)을 활성화한 이후로 이제 다음과 같은 함수 구성 요소 반환 유형에 대한 오류가 발생합니다.

으아악

Since global JSX 命名空间已被弃用，那么在这种情况下 JSX.Element 올바른 반환 유형 대체는 무엇입니까?

지원 중단 메시지에 명시된 대로 React.JSX.Element인가요?

으아악

또는 ReactElement 이렇게:

으아악

또는 React.FC를 사용하여 함수 구성 요소를 선언하고 TypeScript가 다음과 같이 반환 유형을 추론하도록 하는 것이 더 좋습니다.

으아악

Answer 1

사용React.JSX.

---

또는 "react" 导入 JSX에서:

으아악

Answer 2

직접 사용 React.ReactElement（或者更准确地说，React.ReactElement | null):

으아악

정확히는 이것이다(더 이상 권장되지 않음) React.FC 시행:

으아악

그것도 JSXElementConstructor:

으아악

---

즉, 함수 구성 요소 반환 유형을 입력하도록 강제하는 규칙이 없으면 단순성을 위해 무시할 수 있습니다.

으아악

이제 함수는 무엇이든 반환할 수 있으며 Typescript는 불평하지 않을 것입니다... fb/cra#8177에 명시된 대로 JSX 템플릿의 기능적 구성 요소로 사용하지 않는 한:

으아악