如何使用 React-Native-FS 渲染图像

Cri*_*s69 2 react-native react-native-fs

在我的 Android 反应本机应用程序中,我将 jpg 文件从缓存文件夹移动到 RNFS.DocumentDirectoryPath,我在其中创建了一个“图像”文件夹。我无法渲染这些图像:

在反应类中:

state = {source:null}

async componentDidMount() {    

  async loadFile ( path ){
    await this.setState({source:{uri:path}})
  }

  const path = RNFS.DocumentDirectoryPath+'/images/d88b102c-d4c6-4dc1-9a4c-f2a0e599ddbf.jpg'


  await RNFS.exists(path).then( exists => {
        if(exists){
          this.loadFile(path);
      }
 }

   renderItem = ({ item }) => (
      <View key={item.Id} >
        <View>
          <TouchableOpacity onPress={() => this.onPressItem(item)}>
          <Text>{item.cardName}</Text>  
          <Image 
          source={this.state.source}
          style={{ width:'auto', height: 55 }}
          />
          </TouchableOpacity>
        </View>
      </View>
    );
Run Code Online (Sandbox Code Playgroud)

如果我将图像转换为 base64,图像就会存在,它会正确渲染。

Cri*_*s69 6

我缺少“文件://”

const path = "file://"+RNFS.DocumentDirectoryPath+'/images/d88b102c-d4c6-4dc1-9a4c-f2a0e599ddbf.jpg'
Run Code Online (Sandbox Code Playgroud)