Question

我正在尝试在我的Image组件中要求使用react-native-fetch-blob下载图像，但是当我给它图像路径时，它一直在说“未知命名模块：”/ Users / ... / Library / ...'

要求存储在本地目录中的图像的正确方法是什么？

    class Amphibian {
      public void moveInWater(){
      System.out.println("Moving in water");
    }
}
    public class Frog extends Amphibian {
      public void moveInWater() {
      System.out.println("... from the Land");
 }
      public static void main (String[] args) {
      Frog wood = new Frog();
      wood.moveInWater();
    }
}

我的渲染方法：

let imagePath = null

RNFetchBlob
  .config({
     fileCache : true
  })
  .fetch('GET', uri)
  // the image is now dowloaded to device's storage
  .then((resp) => {
     // the image path you can use it directly with Image component
     imagePath = resp.path()
     this.setState({ uri: require(imagePath) })

     try {
       AsyncStorage.setItem(`${this.props.uri}`, imagePath);
     } catch (error) {
       console.log(error)
     }
  })

问题不在于我将变量设置为源，因为我在下载后添加了render() { return( <Image style={this.props.style} source={this.state.uri} /> ) }之类的内容时它正在工作。

Answer 1

require(imagePath)用于帮助打包程序查找本地图像并将其放置到应用程序包中。

当您需要显示动态加载的图片时，您只需将file位置作为URI传递，例如：

render() {
  const imageAbsolutePath = this.state.imagePath;
  const imageUri = 'file://' + imageAbsolutePath;
  return <Image source={{uri: imageUri}}/>;
}

所以，在这种情况下你不需要任何require语句。

需要使用react-native-fetch-blob下载本地映像

1 个答案: