React Native Expo iOS模拟器选择图片后无法显示问题排查

问题核心原因 #

从你的调试输出可以看到，Expo ImagePicker 新版本的返回结构已经变更：选择图片后，uri 并不直接挂在 result 对象下，而是嵌套在 result.assets[0] 中；同时旧版本的 cancelled 属性已改为美式拼写 canceled。你的代码仍在使用旧的取值方式，导致 profileImage 始终为 null，组件自然不会更新。

修复方案 #

1. 修正图片选择函数 #

修改 pickImage 函数，调整取值路径并修正属性拼写：

const pickImage = async () => {
  try {
    const result = await ImagePicker.launchImageLibraryAsync({
      mediaTypes: ImagePicker.MediaTypeOptions.Images,
      allowsEditing: true,
      aspect: [4, 3],
      quality: 1,
    });
    // 修正判断条件和取值路径
    if (!result.canceled && result.assets.length > 0) {
      setProfileImage(result.assets[0].uri);
      console.log('Image picker result:', result);
    }
  } catch (error) {
    console.log('Error picking image', error);
  }
};

2. 补充缺失的Platform导入 #

你的 useEffect 中使用了 Platform 但未导入，会导致运行报错，需要在react-native导入中添加：

import { View, Text, TextInput, TouchableOpacity, Image, StyleSheet, ScrollView, Platform } from 'react-native';

模拟器环境说明 #

iOS模拟器本身不会导致这个问题，只要权限已正常获取（你的代码中已请求相册权限），修复上述代码后即可正常显示图片。

内容的提问来源于stack exchange，提问作者Anonymous