Sometimes, we want to use Image with a local file with React Native.
In this article, we’ll look at how to use Image with a local file with React Native.
How to use Image with a local file with React Native?
To use Image with a local file with React Native, we can call require to retrieve the image and set that as the source prop’s value.
For instance, we write:
import * as React from 'react';
import { Image, View } from 'react-native';
import Constants from 'expo-constants';
import { Card } from 'react-native-paper';
export default function App() {
const [text, setText] = React.useState();
return (
<View>
<Image source={require('./assets/snack-icon.png')} />
</View>
);
}
to call require with a local image path.
And then we set that as the source value to display the image.
Conclusion
To use Image with a local file with React Native, we can call require to retrieve the image and set that as the source prop’s value.
