typescript react consume context with HOC 的问题

Question

问题描述

typescript react consume context with HOC 的问题

相关代码

withNavigation = <P extends IWithNavigationProps>(WrappedComponent: React.ComponentType<P>) => {
    type IComponentWithNavigation = Omit<P, keyof IWithNavigationProps>

    const ComponentWithNavigation = (props: IComponentWithNavigation & { forwardedRef: React.Ref<{}> }) => {
      const { forwardedRef, ...restProps } = props

      return (
        <NavigationContext.Consumer>
          {
            navigationFromContext => {
              const navigation = getNavigation(navigationFromContext)

              return (
                <WrappedComponent
                  navigation={navigation}
                  {...restProps as P}
                  ref={forwardedRef}
                />
              )
            }
          }
        </NavigationContext.Consumer>
      )
    }

    ComponentWithNavigation.displayName = `withNavigation(${WrappedComponent.displayName || WrappedComponent.name})`

    return hoistNonReactStatic(forwardRef((props, ref) => (
      <ComponentWithNavigation {...props as P} forwardedRef={ref} />
    )), WrappedComponent)
  }

提示错误

Conversion of type 'Pick<Pick<P, Exclude<keyof P, "navigation">> & { forwardedRef: any; }, Exclude<Exclude<keyof P, "navigation">, "forwardedRef">>' to type 'P' may be a mistake because neither type sufficiently overlaps with the other. If this was intentional, convert the expression to 'unknown' first.