Question

文档清楚地表明你不能做任何动态要求：

// GOOD
<Image source={require('./my-icon.png')} />

// BAD
var icon = this.props.active ? 'my-icon-active' : 'my-icon-inactive';
<Image source={require('./' + icon + '.png')} />

// GOOD
var icon = this.props.active ? require('./my-icon-active.png') : require('./my-icon-inactive.png');
<Image source={icon} />

我有一个不那么剪切和干燥的用例，但是我有一个ListView，并且在renderRow方法中我想根据所述行中的一些数据渲染一个Image。例如，我想渲染../img/12.png，通过这样做

<Image style={styles.thumb} source={require("../img/12.png")} />

工作正常，但是

let imagePath = "../img/" + row.number + ".png";  // row.number being 12
<Image style={styles.thumb} source={require(imagePath)} />

给出以下错误：

Requiring unknown module "../img/12.png"

这里是否有任何解决方法，似乎它仍然需要完全相同的字符串，它只是不起作用

Answer 1

好的，我想通了，并且发现我会发布一个答案，以防将来有人遇到这种困难。

答案是您需要明确要求所有图像，否则它们不会被捆绑，因此未知模块错误。

解决方案：在一个单独的文件中，我创建并导出了一个按数字键入的对象，其值为require（“../ img / x.png”），其中x是键。然后在我的ListView的renderRow方法中，我通过使用row.number键入它来从对象中拉出图像

Answer 2

你需要这样做：

@Provides Concrete<T> providesConcrete() {
   return new Concrete<T>();
}

React Native Image组件，需要未知模块

2 个答案: