Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

256
Views
react-native-image-crop-picker no muestra la imagen

My Image Picker puede seleccionar una imagen de la galería, pero no puede mostrar la imagen en la aplicación. Lo intenté de muchas maneras y revisé mi código nuevamente, pero no estoy seguro de qué salió mal. ¿Alguien puede decirme cuál es el problema? Aquí está mi versión reactiva y selectora:

"react-native-image-crop-selector": "^0.37.2", "react-native": "0.67.1",

 import { Alert, Image, ScrollView, StyleSheet, Text, TouchableOpacity, View, SafeAreaView, TextInput} from 'react-native'; import ImagePicker from 'react-native-image-crop-picker'; const Imagepick = ({navigation}) => { const [image, setImage] = useState(null) const [images, setImages] = useState(null) const pickSingle = (cropit, circular = false, mediaType) => { ImagePicker.openPicker({ width: 500, height: 500, cropping: cropit, cropperCircleOverlay: circular, sortOrder: 'none', compressImageMaxWidth: 1000, compressImageMaxHeight: 1000, compressImageQuality: 1, compressVideoPreset: 'MediumQuality', includeExif: true, cropperStatusBarColor: 'white', cropperToolbarColor: 'white', cropperActiveWidgetColor: 'white', cropperToolbarWidgetColor: '#3498DB', }) .then((image) => { console.log('received image', image); setImage({ uri: image.path, width: image.width, height: image.height, mime: image.mime, }) setImage(null); }) .catch((e) => { console.log(e); Alert.alert(e.message ? e.message : e); }); } const renderAsset = (image) => { return renderImage(image); } const renderImage = (image) => { return ( <Image style={{ width: 300, height: 300, resizeMode: 'contain' }} source={image} /> ); } return ( <View style={styles.container}> {image ? renderAsset(image) : null} {images ? images.map((i) => ( <View key={i.uri}>{this.renderAsset(i)}</View> )) : null} <TouchableOpacity onPress={() => pickSingle(false)} style={styles.button}> <Text style={styles.text}>Select Single</Text> </TouchableOpacity> </View> ) } export {Imagepick}
about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

Es porque está configurando la imagen como nula justo después de configurar su valor

 .then((image) => { console.log('received image', image); setImage({ uri: image.path, width: image.width, height: image.height, mime: image.mime, }) // setImage(null); //remove this line })

también está pasando datos completos en la fuente de la imagen. En su lugar, solo pasa uri así

 const renderImage = (image) => { return ( <Image style={{ width: 300, height: 300, resizeMode: 'contain' }} source={{uri:image.uri}} /> ); }
about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!