Skip to content

Commit

Permalink
docs: update README
Browse files Browse the repository at this point in the history
  • Loading branch information
mthahzan committed Dec 19, 2024
1 parent 04cd4aa commit ffb404e
Showing 1 changed file with 14 additions and 13 deletions.
27 changes: 14 additions & 13 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -27,30 +27,30 @@ yarn add react-native-image-fallback
## Usage

```jsx
import { ImageLoader } from 'react-native-image-fallback';
import {ImageLoader} from 'react-native-image-fallback';

const IMAGE_URL = { uri: 'http://image.url' };
const IMAGE_URL = {uri: 'http://image.url'};
const FALLBACKS = [
{ uri: 'http://another.image.url' },
{uri: 'http://another.image.url'},
require('./local/image/path'),
];

const App = () => <ImageLoader source={IMAGE_URL} fallback={FALLBACKS} />;
const App = () => <Image source={IMAGE_URL} fallback={FALLBACKS} />;
```

## Properties

`ImageLoader` extends the React Native `Image` component, so all the `<Image />` props will work. In addition, it supports the following props:
`Image` extends the React Native `Image` component, so all the `<Image />` props will work. In addition, it supports the following props:

| Prop | Type | Description |
| ----------- | -------------------------------------------- | ---------------------------------------------------------------- |
| `source` | [`TImageLoaderSource`](#timageloadersource) | **REQUIRED** The source image |
| `fallback` | `TImageLoaderSource \| TImageLoaderSource[]` | The fallback image(s). Can be a single item or an array |
| `component` | Component | Alternative component to use. Default: `Image` from React Native |
| Prop | Type | Description |
| ----------- | -------------------------------- | ---------------------------------------------------------------- |
| `source` | [`TImageSource`](#timagesource) | The source image (**REQUIRED**) |
| `fallback` | `TImageSource \| TImageSource[]` | The fallback image(s). Can be a single item or an array |
| `component` | Component | Alternative component to use. Default: `Image` from React Native |

### TImageLoaderSource
### TImageSource

`TImageLoaderSource` is a type that can be a `require('')` image file, or an [image source](https://github.com/facebook/react-native/blob/master/Libraries/Image/ImageSource.js) object.
`TImageSource` is a type that can be a `require('')` image file, or an [image source](https://github.com/facebook/react-native/blob/main/packages/react-native/Libraries/Image/ImageSource.js) object.

### `fallback`

Expand All @@ -64,8 +64,9 @@ Any component that has the same props as the React Native `Image` component can

```jsx
import FastImage from 'react-native-fast-image';
import Image from 'react-native-image-fallback';

<ImageLoader component={FastImage} source={imageSource} fallback={fallbacks} />;
<Image component={FastImage} source={imageSource} fallback={fallbacks} />;
```

## Contributing
Expand Down

0 comments on commit ffb404e

Please sign in to comment.