Question

这可能是Image组件中反应原生的潜在错误：

//1. Works as expected
render() {
   return (
     <View>
         <Image source={require('../images/somepic.jpg')}
             resizeMode='contain'
             style={{width: 600, height: 600}}
             />
     </View>
   );
}


//2. Does not work:
render() {
   var imageLocation = '../images/somepic.jpg';
   return (
     <View>
         <Image source={require(imageLocation)}
             resizeMode='contain'
             style={{width: 600, height: 600}}
             />
     </View>
   );
}

在第二个例子中，显示的错误是：需要未知模块＆＃34; ../ images / somepic.jpg＆＃34;。如果您确定那里有模块，请尝试重新启动软件包或运行＆＃34; npm install＆＃34;

Answer 1

文档不建议采用这种方式

本地语的official documentation以这种方式声明，使用变量 BAD 。

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

建议采用以下模式：

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


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

图像组件动态声明源

1 个答案:

文档不建议采用这种方式