rns

react-native-safe-image

Really light React-Native package to handle fallback when image is on error

Showing:

Popularity

Downloads/wk

17

GitHub Stars

25

Maintenance

Last Commit

2yrs ago

Contributors

1

Package

Dependencies

0

License

MIT

Type Definitions

Built-In

Tree-Shakeable

No?

Categories

Readme

NPM version

react-native-safe-image

Really light React-Native package to handle fallback when image is on error

  • fallback to other image
  • fallback to a component

How to use it ?

yarn add react-native-safe-image

import { SafeImage } from 'react-native-safe-image'

// ...
render() {
  return (
    <SafeImage
      source={{ uri: 'http://Normal-Image-Maybe-OnError.jpg' }}
      fallbackImageSource={require('./Path-To/FallbackImage.jpg')}
      style={{ width: 30, height: 30 }}
      resizeMode="contain"
    />
  )
}
// ... or ...
const noImg = <View><Text>No Img</Text></View>
render() {
  return (
    <SafeImage
      source={{ uri: 'http://Normal-Image-Maybe-OnError.jpg' }}
      fallbackComponent={noImg}
      style={{ width: 30, height: 30 }}
      resizeMode="contain"
    />
  )
}

Todos

  • add fallbackComponent prop

Hire an expert!

Looking for a ReactNative freelance expert with more than 12 years experience? Contact me from my website!

Rate & Review

Great Documentation0
Easy to Use0
Performant0
Highly Customizable0
Bleeding Edge0
Responsive Maintainers0
Poor Documentation0
Hard to Use0
Slow0
Buggy0
Abandoned0
Unwelcoming Community0
100