Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Does getScrollContainer should return type HTMLElement instead of ReactNode? #243

Open
ndhungw opened this issue Sep 22, 2022 · 0 comments

Comments

@ndhungw
Copy link

ndhungw commented Sep 22, 2022

When using this lib inside a tsx file, like the code below

// ...
import RMCPullToRefresh from "rmc-pull-to-refresh";

const PullToRefresh = ({ onRefresh, children }: IPullToRefreshProps) => {
  // my other logics

  return (
    <RMCPullToRefresh
      getScrollContainer={() => document.body}
      direction="down"
      scale={1}
      distanceToRefresh={REFRESH_DISTANCE}
      onRefresh={onRefresh}
      indicator={{
        activate: <ActivateIndicator />,
        deactivate: <DeactivateIndicator />,
        finish: <FinishIndicator />,
        release: <ReleaseIndicator />,
      }}
      damping={REFRESH_DISTANCE}
    >
      {children}
    </RMCPullToRefresh>
  );
};

I got into this issue:

Compiled with problems:

ERROR in src/components/PullToRefresh/PullToRefresh.tsx:128:7

TS2769: No overload matches this call.
  Overload 1 of 2, '(props: PropsType | Readonly<PropsType>): PullToRefresh', gave the following error.
    Type '() => HTMLElement' is not assignable to type '() => ReactNode'.
      Type 'HTMLElement' is not assignable to type 'ReactNode'.
        Type 'HTMLElement' is missing the following properties from type 'ReactPortal': key, type, props
  Overload 2 of 2, '(props: PropsType, context: any): PullToRefresh', gave the following error.
    Type '() => HTMLElement' is not assignable to type '() => ReactNode'.
    126 |   return (
    127 |     <RMCPullToRefresh
  > 128 |       getScrollContainer={() => document.body}
        |       ^^^^^^^^^^^^^^^^^^
    129 |       direction="down"
    130 |       scale={1}
    131 |       distanceToRefresh={REFRESH_DISTANCE}

I think the interface PropsType should be

export interface PropsType {
  getScrollContainer: () => HTMLElement;
  direction: "down" | "up";
  refreshing?: boolean;
  distanceToRefresh: number;
  onRefresh: () => void;
  indicator: Indicator;
  prefixCls?: string;
  className?: string;
  style?: React.CSSProperties;
  damping?: number;
  scale?: number;
  children?: ReactNode;
}

instead of

export interface PropsType {
  getScrollContainer: () => React.ReactNode;
  direction: 'down' | 'up';
  refreshing?: boolean;
  distanceToRefresh: number;
  onRefresh: () => void;
  indicator: Indicator;
  prefixCls?: string;
  className?: string;
  style?: React.CSSProperties;
  damping?: number;
  scale?: number;
}

Branch: master
Commit: e60268f
Parents: e96ce45
Author: duxiaodong <duxiaodong@darlin.me>
Committer: duxiaodong <duxiaodong@darlin.me>
Date: Mon Jun 15 2020 14:32:42 GMT+0700 (Indochina Time)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant