javascript - 在 React Native 中获取图像时 require() 不使用内插字符串

Question

我在 React Native 中使用一个 Image 组件作为背景，目前正在为 source prop 提供一个图像，效果如下。

const ImageWrapper = (props) => {
      return (
        <Image source={require('../../../images/testingImages/cells.png')} style={styles.imageView}>
          {props.children}
        </Image>
      );
    };

但是，我想为 require 提供一个内插字符串，其中包含 Prop 提供的图像名称:

require(`../../../images/testingImages/${props.imgURL}`)

但每当我这样做时(即使我在不​​使用 ES6 的情况下将字符串创建为单独的变量并将其传递给 require)。我收到错误 -

"unknown named module '../../../images/testingImages/cells.png'".

有没有办法不用require就可以获取图片？因为我希望能够将图像 url 作为 prop 传递，以便在我想要更改背景时可以重用该组件。

非常感谢任何帮助!

Answer 1

希望其他人可以为您的确切问题提供解决方案，因为我遇到了同样的问题，但我的解决方法是将 source 的整个值作为 Prop 传递。在我的场景中，我将它作为列表中每个 map 的某个键的值，所以这对我来说足够干净了。但这可能只是将您的问题提升了一个级别。