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

Property 'uri' does not exist on type 'ImageSourcePropType'

$
0
0

I'd like to wrap the image component of react-native. However, an error message appears saying that 'uri' Property does not exist. Why does this happen?

import React from 'react';import { Image as DefaultImage, ImageProps } from 'react-native';import { PromiseFn, useAsync } from 'react-async';type ImageSize = {  width: number;  height: number;};const getImageSize = (uri: string) => {  return new Promise<ImageSize>((resolve, reject) => {    DefaultImage.getSize(      uri,      (width, height) => {        resolve({ width, height });      },      (error) => {        reject(error);      }    );  });};const promiseFn: PromiseFn<ImageSize> = async ({ uri }) =>  await getImageSize(uri);export function Image(props: ImageProps) {  const { source } = props;  const { data, error, isPending } = useAsync<ImageSize>({    promiseFn: promiseFn,    uri: source.uri, // Property 'uri' does not exist on type 'ImageSourcePropType'.                     // Property 'uri' does not exist on type 'number'.ts(2339)  });  return (<DefaultImage      style={[{ width: data?.width, height: data?.height }, props.style]}      {...props}    />  );}

I tried a different method, but there's another error.

const isImageURISource = (  source: ImageURISource | ImageURISource[] | ImageRequireSource) => {  if ('uri' in source) {    return source; // The right-hand side of an 'in' expression must be of type 'any', an object type or a type parameter.ts(2361)  }};

Viewing all articles
Browse latest Browse all 6214

Trending Articles