在react-native中将本地图像uri作为props传递

我正在尝试将图像的 uri 作为 prop 传递，以便我可以在 React-Native 上多次重复使用它。但是，当前的解决方案提示我 require 应该使用字符串文字。

const ImageButton = ({ source }) => (
    <Image source={require({ source })} />
);

ImageButton.propTypes = {
     uri: PropTypes.string,
};

我还尝试将 uri 声明为 PropTypes.func，然后执行

<Image source={{ source }} />

但图像没有出现。图像 uri 属性的正确实现是什么？

您需要为需要图像创建单独的对象，因为动态定义的字符串是不可能的。

例如：

const assets = {
  imageButton: require('./assets/button.jpg'),
};

const ImageButton = (source) => {
  <Image source={assets[source]} />
}

class MyComponent extends Component(props) {
  render() {
    return (
      <ImageButton source={'imageButton'} />
    )
  }  
}