React Native - 动态图像源 [英] React Native - Dynamic Image Source

问题描述

我正在尝试使用map方法遍历 SOURCE 数组，但我一直收到此错误：

I'm trying to loop through the SOURCE array with the map method, but I keep getting this error:

未知的命名模块：'../ images / one.jpeg'

任何人都知道为什么这是发生了什么？ require 中的文件路径绝对正确。

Anyone know why this is happening? The file path in the require is definitely correct.

var SECTIONS = [
  {
    title: 'One',
    fileName: 'one.jpeg',
  },
  {
    title: 'Two',
    fileName: 'two.jpeg',
  },
  {
    title: 'Three',
    fileName: 'three.jpeg',
  },
  {
    title: 'Four',
    fileName: 'four.jpeg',
  },
];


{SECTIONS.map((section, i) => (
   <CategoryCard
     key={i}
     source={require(`../images/${section.fileName}`)}
     title={section.title}
   />
))}

推荐答案

我不认为这是可能的，因为本机需要提前知道要捆绑什么（据我所知）。但是，您可以 require 数组中的所有文件：

I don't think this is possible because react native needs to know what to bundle ahead of time (AFAIK). However, you can require all the files in your array:

var SECTIONS = [
  {
    title: 'One',
    file: require('../images/one.jpeg'),
  },
  {
    title: 'Two',
    file: require('../images/two.jpeg'),
  },
  {
    title: 'Three',
    file: require('../images/three.jpeg'),
  },
  {
    title: 'Four',
    file: require('../images/four.jpeg'),
  },
];


{SECTIONS.map((section, i) => (
   <CategoryCard
     key={i}
     source={section.file}
     title={section.title}
   />
))}

这篇关于React Native - 动态图像源的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！