구성 요소에서 Props 유형을 가져오고 그 안에 있는 속성을 생략합니다.

Question

저는 React "고차 구성 요소"용 TypeScript 함수를 개발 중입니다. 필수:

• 구성요소
• React 쿼리 useQuery 유형 함수
• 매개변수 배열을 반환하고 이를 위의 useQuery 유형 함수
에 전달합니다.
• 선택 사항 resultKey 쿼리 결과를 구성 요소에 전파할지 아니면 특정 키 아래에 중첩할지 결정합니다.

지금까지 구현한 내용은 다음과 같습니다.

으아악

잘 작동하지만 올바른 유형을 찾는 데 문제가 있습니다. 이상적으로는 구성 요소(입력된)를 전달하고 함수는 구성 요소에 필요한 최종 소품 세트가 무엇인지 해당 구성 요소에서 "추론"합니다. 그런 다음 해당 구성 요소에 대해 withQuery 的结果将返回一个具有单独的、较小的所需道具集的组件，因为 withQuery 호출을 호출하면 상위 구성 요소에서 전달할 필요가 없는 소품이 제공됩니다.

예를 들어 다음과 같이 하세요.

으아악

withQuery 함수는 이상적으로 충분히 "스마트"해야 합니다:

1. 전달된 구성요소에서 "전체" prop 유형(org 및 uuid) 추론
2. "org"는 resultKey，所以该 prop 是从查询传入的，不需要从外部传入。因此，可以从导出的组件类型中省略 Omit이므로 prop은 쿼리에서 전달되며 외부에서 전달될 필요가 없다는 점을 이해하세요. 따라서 내보낸 구성요소 유형에서 생략ted를 생략할 수 있습니다.

매우 이상적입니다. useGetOrg를 입력하고 resultKey가 전달되지 않으면(쿼리 결과가 props로 전파됨을 의미) useGetOrg ，并且没有传递 resultKey （意味着查询的结果作为 props 传播）， withQuery 함수는 응답의 모든 키를 감지할 수 있습니다. 쿼리에 의해 제공되므로 렌더링 상위 구성 요소에서 전달할 필요가 없습니다.

이게 가능한가요? 이것은 현재 내 TypeScript 기능을 약간 넘어서는 것입니다.

부모 구성 요소가 자체적으로 제공하지 않는 소품withQuery만 전달하면 되도록 이 유형 추론을 처리하기 위해 이 메서드를 재정의할 수 있습니까?

아니면, 가능하지 않다면 호출할 때 withQuery 생성된 컴포넌트의 props 유형을 전달할 수도 있을까요?

Answer 1

질문을 올바르게 이해했다면 withQuery 的组件类型，并从其 props 中删除传递到 resultKey 매개변수에 전달된 속성을 추론하려는 것입니다.

매개변수의 React.ComponentProps 实用程序类型来提取组件的 props 类型。然后，您可以使用 Omit 类型实用程序从组件的 props 中提取传递到 resultKey 속성을 사용할 수 있습니다.

으아악

구성 요소 자체에서 React 구성 요소 Prop 유형을 추출하는 방법에 대한 자세한 내용은 이 답변을 참조하세요.

또는 Query의 결과 유형을 추론하고 해당 결과 유형을 기반으로 props에서 속성을 제거하려는 경우 ResultType 实用程序类型和 keyof를 사용하여 다음 기능을 구현할 수 있습니다.

으아악