Javascript 在React Native中需要非静态映像
我在React本机应用程序中有一个包含图像的特殊文件夹。这些图片的路径存储在作为道具传递到卡组件的特殊对象中。所以,我不能使用require,因为它只使用静态路径字符串。如何使用从道具加载这些图像?这是我的尝试:Javascript 在React Native中需要非静态映像,javascript,image,react-native,require,Javascript,Image,React Native,Require,我在React本机应用程序中有一个包含图像的特殊文件夹。这些图片的路径存储在作为道具传递到卡组件的特殊对象中。所以,我不能使用require,因为它只使用静态路径字符串。如何使用从道具加载这些图像?这是我的尝试: import React from 'react'; import { View, Text, Image, TouchableOpacity, StyleSheet } from 'react-native'; import EmptyImage from '..
import React from 'react';
import {
View,
Text,
Image,
TouchableOpacity,
StyleSheet
} from 'react-native';
import EmptyImage from '../data/images/empty-image.jpg';
class Card extends React.Component {
constructor(props) {
super(props);
}
render() {
const { myObject } = this.props;
return (
<View>
<Image
source={
myObject.imagesNames[0] ?
require(`../data/images/${myObject.imagesNames[0]}`)
:
EmptyImage
}
/>
</View>
);
}
}
export default Card;
从“React”导入React;
进口{
看法
文本,
形象,,
可触摸不透明度,
样式表
}从“反应本机”;
从“../data/images/empty image.jpg”导入EmptyImage;
类卡扩展了React.Component{
建造师(道具){
超级(道具);
}
render(){
const{myObject}=this.props;
返回(
);
}
}
导出默认卡;
由于您的图像是本地的,因此最好通过如下所示的图像创建一个json对象
images={
image1:require('path'),
image2:require('path2'),
};
<Image source={
myObject.imagesNames[0] ?images[imagesNames[0]]:EmptyImage
}
/>
您可以像下面这样设置url
images={
image1:require('path'),
image2:require('path2'),
};
<Image source={
myObject.imagesNames[0] ?images[imagesNames[0]]:EmptyImage
}
/>