【原创】解决 React Native 报错:calls to require expect exactly 1 literal string

blogdaren 2018-06-22 抢沙发 3472人次

问题背景:

在React Native中使用Image组件,结果报错:calls to require expect exactly 1 literal string,代码原型如下:

let image_path = '../image/test.png'; 
<Image source={require(image_path)} style={{width: 50, height: 50}} />

问题截图:

33.png

问题原因:

这是由于require指令使用了image_path变量所致的,换句话:require指令不支持变量类型,See 后面的注意事项。

解决方案:

<Image source={require("../image/test.png")} style={{width: 50, height: 50}} />

注意事项:

1. 对于Image组件,因为require指令是在编译期间执行,而非运行期间执行!所以require指令中的图片名字必须是一个静态字符串,而不能是任何其他的数据类型;除外require的参数字符串也不支持拼接,比如下面的拼接用法也是错误的:

<Image source={require("../image/" + "test.png")} style={{width: 50, height: 50}} />
2. 对于Image组件,为了使图片能正确的显示,要求必须时刻显示的指定图片的宽高,即:style={{width: 50, height: 50}}

#source##Image##Error#

版权声明:除非注明,本文由( blogdaren )原创,转载请保留文章出处。

本文链接:【原创】解决 React Native 报错:calls to require expect exactly 1 literal string

发表评论:

您的昵称:
电子邮件:
个人主页:

Free Web Hosting