📅  最后修改于: 2023-12-03 15:08:46.864000             🧑  作者: Mango
在 React Native 中显示本地图像非常简单。以下是基本步骤:
把图像文件放在项目的 /assets
目录下。
在组件中导入 Image
组件。
import { Image } from 'react-native';
Image
组件中使用 require
来引入图像文件。<Image source={require('../../assets/myImage.png')} />
uri
属性。<Image source={{ uri: 'https://example.com/myImage.png' }} />
完整代码示例:
import React from 'react';
import { View, Image } from 'react-native';
const MyComponent = () => {
return(
<View>
<Image source={require('../../assets/myImage.png')} />
<Image source={{ uri: 'https://example.com/myImage.png' }} />
</View>
);
};
export default MyComponent;
注意:在使用 Image
组件时,请确保图像文件存在,路径和文件名正确,大小写敏感。对于网络图像,请确保网络连接正常。