Question

我正在学习本机响应，在为我的应用程序要求图片时遇到一个奇怪的问题。我做了一些测试，这是我发现的东西：

// Not OK
path = "../imgs/banana.png"
require(path)

// OK
let path = "../imgs/banana.png"
require(path)

// Not OK
let path = "../imgs/" + this.props.fileName
require(path)

但是对于两种无法使用500错误代码的情况，我都会遇到相同的错误：

calls to 'require' expect exactly 1 string literal argument, but this was found: 'require(path)'

第二个发现require(\"../imgs\" + this.props.fileName) 但是path的值是正确的：../imgs/banana.png

为什么会这样？还是我错过了什么？

您如何要求多张图片，而不必在切换时指定每张图片？

Answer 1

错误是您必须将字符串文字与require而非表达式一起使用。

换句话说，您不能在该环境中动态require {

编辑：如果您事先知道所有图像，则可以将对它们的引用推入一个对象中：

const images = {
  banana: require('banana.png'),
  apple: require('apple.png'),
  monkey: require('monkey.png'),
}

并使用{images.banana}（或动态使用{images[this.props.imageName]}）。

Answer 2

您应该能够使用这样的动态字符串：

let path = `../imgs/${this.props.fileName}`

您必须使用不同的引号。

require（）如何工作？

2 个答案: