ios - 如何获取rct-image-store ://0的绝对路径

Question

我用 ImageEditor 这样裁剪了图片:

   ImageEditor.cropImage(
        photo.imageUri,
        cropData,
        (croppedImageURI) => {                
           imageSource = croppedImageURI;    
        },
        (cropError) => {
            console.log("fail");
        }
    );

裁剪后的图片路径为“rct-image-store://0”。如果在同一屏幕中使用此路径，此图像会很好地显示。但是，如果我将此路径传递给其他屏幕:

this.props.navigation.navigate('Tape', { imageSource });

然后我得到这个错误:

JSON value '{ uri = "rct-image-store://0"; }' of type NSMutableDictionary cannot be converted to an image. Only local files or data URIs are supported.

我该如何解决这个问题？

Answer 1

您可以使用 react-native-image-resizer为此。您将获得类似这样的路径。

/var/mobile/Containers/Data/Application/3BA7E152-E21E-4ADD-84A3-8CCCBC7FBFAE/Documents/var/mobile/Containers/Data/Application/3BA7E152-E21E-4ADD-84A3-8CCCBC7FBFAE/Documents/194D4C64-8EA9-4058-9307-BA1316347DA0.jpg

您可以将此图像文件路径传递给其他屏幕。示例代码如下:

import ImageResizer from 'react-native-image-resizer';
const RNFS = require('react-native-fs');

// The output path you can use whatever you want, for sample I am using 
// documentary path.
const outputPath = `${RNFS.DocumentDirectoryPath}`;

// The imageStore path here is "rct-image-store://0" 
ImageResizer.createResizedImage(
    imageStorePath,
    1280,
    720,
    'JPEG',
    25,
    0,
    outputPath,
).then((success) => {
    console.log(success);
    console.log(success.path);
    //If you console success.path then it will give you something like this
    // /var/mobile/Containers/Data/Application/3BA7E152-E21E-4ADD-84A3-8CCCBC7FBFAE
    // /Documents/var/mobile/Containers/Data/Application/3BA7E152-E21E-4ADD-84A3-8CCCBC7FBFAE/Documents/194D4C64-8EA9-4058-9307-BA1316347DA0.jpg
})