Question

Hello comunity :)我正在使用react-native的testapp，并尝试从本地存储位置获取图像。实际我在做什么：我给一个图像directlink源到var并在我的渲染函数中调用这个方法。

*react: ^0.14.8 ||*
*react-native: ^0.23.1||*
*npm: 2.15.1 ||*
*node: v4.4.4*

工作：

ImageCall-File（Imagefile.js）

var samplepicture;

setPicture(){
    samplepicture= require('./images/picture.png')
}
render() { 
    this.setPicture; 
    return(
        <Image source=samplepicture/>
    ); 
}

上面的代码片段在以（Imagefile.js）命名的已创建类中工作

上述方法效果很好。

现在我想去的地方＆gt;我想将图像文件保存在一个单独的js文件中，其格式类似于JSON对象。

不工作：

JS_JSON_File（pictureRef.js）

module.exports = {
    "pictureRef": 
{
    "picture": './images/picture.png'
}}

ImageCall_File（Imagefile.js）

var pictureRef = require('./pictureRef.js');
var samplepicture;

setPicture(){
    samplepicture= require(pictureRef.pictureRef.picture);
}
render() { 
    this.setPicture; 
    return(
        <Image source=samplepicture/>
    ); 
}

调试samplepicture： samplepicture = ./images/picture.png

不确定它是否相关，但因为它是一个字符串，所以它的格式没有''。另外请记住，我需要通过setPicture（）函数为我的代码设置图像源。

*我调试了两个版本的代码并具有相同的输出：

版本1：samplepicture = ./ images/picture.png
第2版：samplepicture = ./ images/picture.png

*

请记住，这是我的第一个问题，我真的希望将一切正确。我也搜索了许多相关的问题，并没有找到任何解决方案

感谢您的帮助。

Answer 1

似乎与此issue1 issue2

相似

我认为如果使用require（）来添加图像，则应该提供静态路径，而不是变量。因为他们需要知道要捆绑的特定图像源。使用json就像一个不确定的来源，所以它不起作用现在有一个公关，

Answer 2

我今天发现的最佳解决方案是没有对象的解决方案-用于从react-native中的json文件动态加载的变量，但是必须将该图像转换为base64格式并将其添加到json文件中，然后再从那里分发正常。

import {} from './a.ts'

export class AppModule { }
function _loadDataSoundFromJson(){ 
  return new Promise((resolve,reject)=>{ 
    if (soundData){ 
      setTimeout(function(){ 
        resolve(soundData) },1500) 
    }
	else { 
      reject("No data found") 
    }}); 
};

react-native - 图像需要来自JSON

2 个答案: