Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6287

How to not use any in React-Native Fast-Image Component TypeScript

$
0
0

I have a component that will show an Image, It will receive an url and style.

interface FastImageProps {  styleComponent: StyleProp<ImageStyle> | StyleProp<ImageStyle>[];  url: string;}export const FastImageComponent: React.FC<FastImageProps> = ({  styleComponent,  url,}: any) => {  return (<FastImage      style={styleComponent}      source={{        uri: `WEB_PATH/${url}`,        priority: FastImage.priority.normal,        cache: FastImage.cacheControl.immutable,      }}      resizeMode={FastImage.resizeMode.cover}    />  );};

it is working properly, but the component is using any. if i remove the any, the style will have a red line and show this

No overload matches this call.  Overload 1 of 2, '(props: FastImageProps, context?: any): ReactElement<any, any> | Component<FastImageProps, any, any> | null', gave the following error.    Type 'false | ImageStyle | RegisteredStyle<ImageStyle> | RecursiveArray<false | ImageStyle | RegisteredStyle<ImageStyle> | null | undefined> | StyleProp<...>[] | null | undefined' is not assignable to type 'StyleProp<ImageStyle>'.      Type 'ImageStyle' is not assignable to type 'StyleProp<ImageStyle>'.        Type 'import("PATH/node_modules/@types/react-native/index").ImageStyle' is not assignable to type 'import("PATH/node_modules/react-native-fast-image/dist/index").ImageStyle'.          Types of property 'backgroundColor' are incompatible.            Type 'string | unique symbol | undefined' is not assignable to type 'string | undefined'.              Type 'unique symbol' is not assignable to type 'string | undefined'.  Overload 2 of 2, '(props: PropsWithChildren<FastImageProps>, context?: any): ReactElement<any, any> | Component<FastImageProps, any, any> | null', gave the following error.    Type 'false | ImageStyle | RegisteredStyle<ImageStyle> | RecursiveArray<false | ImageStyle | RegisteredStyle<ImageStyle> | null | undefined> | StyleProp<...>[] | null | undefined' is not assignable to type 'StyleProp<ImageStyle>'.      Type 'ImageStyle' is not assignable to type 'StyleProp<ImageStyle>'.        Type 'import("PATH/node_modules/@types/react-native/index").ImageStyle' is not assignable to type 'import("PATH/node_modules/react-native-fast-image/dist/index").ImageStyle'.ts(2769)index.d.ts(77, 5): The expected type comes from property 'style' which is declared here on type 'IntrinsicAttributes & FastImageProps'index.d.ts(77, 5): The expected type comes from property 'style' which is declared here on type 'IntrinsicAttributes & FastImageProps & { children?: ReactNode; }'

here is how i call my component

<FastImageComponent styleComponent={{width: sizeWidth(20), height: sizeWidth(20)}} url={imageUrl}/>

can anybody explain to me why this is happening? and What changes do i need to make the component not using any.


Viewing all articles
Browse latest Browse all 6287

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>