反应本机图像 uri 和异步存储

Question

我正在尝试保存个人资料图片，我用 asyncStorage 保存了它。存储部分工作正常，但如果我关闭应用程序并重新打开它不会显示图像。

我记录了图片uri，有uri但无法解决问题。

这是我的代码

这是选图部分

const ImagePick = async () => {
    const options = {
      title: 'Seçim yapınız.',
      cancelButtonTitle: 'İptal',
      takePhotoButtonTitle: 'Bir fotoğraf çek',
      chooseFromLibraryButtonTitle: 'Galeriden seç',
      chooseWhichLibraryTitle: 'Galeriden seç',
      mediaType: 'photo',
      storageOptions: {skipBackup: true, path: 'images'},
    };

    let isCameraPermitted = await requestCameraPermission();
    let isStoragePermitted = await requestExternalWritePermission();

    if (isCameraPermitted && isStoragePermitted) {
      ImagePicker.showImagePicker(options, async response => {
        //console.log('response', response);
        if (response.didCancel) {
          console.log('Kullanıcı fotoğraf seçimini iptal etti');
        } else if (response.customButton) {
          console.log('Özel butona tıklandı.');
        } else if (response.error) {
          console.log('error', 'Bir hata oluştu.');
        } else {
          console.log(response.fileName);
          let uri = response.uri;
          let path = response.uri;
          if (Platform.OS === 'ios') {
            path = '~' + path.substring(path.indexOf('/Documents'));
          }
          if (!response.fileName) {
            response.fileName = path.split('/').pop();
          }
          let name = response.fileName;
          let type = `image/${name.split('.').slice(-1)[0]}`;
          console.log('uri', uri);
          console.log('name', name);
          console.log('type', type);
          setImageUri(response.uri);
          try {
            await AsyncStorage.setItem('profilePicture', response.uri);
            console.log('async storage kayıt başarılı');
          } catch (error) {
            console.log(error);
          }
        }
      });
    }
  };

我得到这样的图像

useEffect(() => {
    getProfilePicture();
  }, []);

  const getProfilePicture = async () => {
    const profilePicture = await AsyncStorage.getItem('profilePicture');
    console.log('profilePicture', profilePicture);

    if (profilePicture !== null) {
      setImageUri(profilePicture);
      setIsLoading(false);
    } else {
      setImageUri(
        'https://t3.ftcdn.net/jpg/03/46/83/96/360_F_346839683_6nAPzbhpSkIpb8pmAwufkC7c5eD7wYws.jpg',
      );
      setIsLoading(false);
    }
  };

Answer 1

模拟器是问题所在。在设备中它正在工作

反应本机图像 uri 和异步存储

react native image uri and async storage

react-native

asyncstorage

react-native-image-picker