我有这种格式的数据：const data = [ { id: '0', title: 'Some title 1' }, { id: '1', title: 'Some title 2' } ...] 并且我有一个包含图像的文件夹，其中每张图片...

我有这种格式的数据：

const data = [
  {
    id: '0',
    title: 'Some title 1'
  },
  {
    id: '1',
    title: 'Some title 2'
  }
  ...
]

我有一个包含图像的文件夹，其中每个图像都被称为“0.png”、“1.png”等，与数据数组长度相同。我试图做的是映射数据数组，显示标题和与元素 ID 同名的图像。例如，

<Image source={require('./images/0.png')} />

所以我写了这段代码：

data.map(item => (
  <View>
    <Image source={require(`./images/${item.id}.png`)} />
    <Text>{item.title}</Text>
  </View>
))

这给了我这个错误：错误：TransformError：第 36 行的调用无效：require(\'./images/\' + item.id + \'.png\')

我也尝试过这种方法：

<Image source={require('./images/' + item.id + '.png')} />

当我使用这种连接创建的图像的路径 console.log 时，它看起来还不错。

顺便说一下，这个方法很好用：

<Image source={require('./images/' + 10 + '.png')} />

并显示名为“10.png”的图像

我是否遗漏了什么？请帮忙！