Блог

Главная - Вопросы по программированию - Наличие нескольких изображений из expo-camera в React Native

Наличие нескольких изображений из expo-camera в React Native

#javascript #react-native #expo

#javascript #react-native #expo

Вопрос:

Я использую expo-camera в своем приложении React Native. Я успешно смог делать фотографии с камеры и получать uri , но я хочу, чтобы мое приложение сохраняло каждую сделанную фотографию в массиве. Вот код, в котором я делаю снимок и сохраняю текущую фотографию каждый раз:

 //Here's the onpress on a button in a different component of taking photo

<TouchableOpacity
    onPress={async () => {
    let photo = await cameraRef.takePictureAsync();
    props.setImage(photo);
    props.setModalVisible();         
    }}
>
            
//Here's the component for image show

export default function ImagePickerExample() {
    const [image, setImage] = useState(null);
    const [camera, setShowCamera] = useState(false);
    const [hasPermission, setHasPermission] = useState(null);
    const [list, setList] = useState([]);

useEffect(() => {
    (async () => {
      const { status } = await Camera.requestPermissionsAsync();
      setHasPermission(status === "granted");
    })();
    }, []);
    
if (hasPermission === null) {
    return <View />;
  }
  if (hasPermission === false) {
    return <Text>No access to camera</Text>;
  }
return (
    <View>
      <View>
       <TouchableOpacity onPress={()=>{setShowModal(true);}}>
        <Image
          source={{ uri: image }} style={{ width: 120, height: 120 }}/>
      </TouchableOpacity>
      </View>
    <View style={{marginTop: 20 }}>
     <Button
       onPress={() => {setShowCamera(true);}}
       title="Camera"
         />
    </View>
    {camera amp;amp; (
        <CameraModule
          showModal={camera}
          setModalVisible={() => setShowCamera(false)}
          setImage={(result) => setImage(result.uri)}
      setList={(result) => setList(result.uri)}
        />
      )}
    </View>
  );
}

Здесь я показываю только одно изображение, но я хочу показать каждое изображение, которое я беру из приложения. Как я могу сохранить каждое изображение, которое я беру, в массиве из этого кода.

Комментарии:

1. попробуйте setList={(result) => setList([...list, ...result.uri])} вместо setList={(result) => setList(result.uri)}

2. setList={(result) => setList([…list, …result.uri])} это возвращает разрозненные данные, но setList={(result) => setList([…list, result.uri])} теперь все возвращается нормально.