Я пытаюсь сделать resuable fuction с помощью библиотеки imagepicker, но когда я импортирую функцию, я получаю неопределенность из компонента, в который я ее импортировал. С console.info я вижу, что он действительно работает. он просто не показывает загруженное изображение.
Я попытался вернуть исходный код и фактическую функцию, но это не сработало.
helperfunction.js
import ImagePicker from 'react-native-image-picker';
export const photoUpload =()=>{
const options = {
title: 'Select Avatar',
camera: [{ name: 'fb', title: 'Take a picture' }],
storageOptions: {
skipBackup: true,
path: 'images',
},
};
const action = ImagePicker.showImagePicker(options, (response) => {
console.info('Response = ', response);
if (response.didCancel) {
console.info('User cancelled image picker');
} else if (response.error) {
console.info('ImagePicker Error: ', response.error);
} else if (response.camera) {
console.info('User tapped custom button: ', response.camera);
} else {
const source = { uri: response.uri };
console.info(source)
return source;
}
})
return action;
}
App.js
import {photoUpload} from '../../../utilities/helper/photoUpload'
handlePhotoUpload = async () =>{
const data = await photoUpload()
console.info(data) (this comes back undefined)
if (data){
this.setState({
photo: data
});
}
}
Если вы посмотрите на сигнатуру функции showImagePicker из документации, вы увидите, что она не имеет возвращаемого значения:
static showImagePicker(options?, callback)
Причина, по которой вы все еще видите результаты из журнала консоли, заключается в том, что когда вы вызываете функцию showImagePicker, она асинхронно вызывает вашу функцию обратного вызова. Чтобы решить эту проблему, вы можете использовать обещание, подобное этому:
export const photoUpload = () => {
const options = {
title: 'Select Avatar',
camera: [{name: 'fb', title: 'Take a picture'}],
storageOptions: {
skipBackup: true,
path: 'images',
},
};
return new Promise(((resolve, reject) => {
ImagePicker.showImagePicker(options, (response) => {
if (response.didCancel) {
reject('User cancelled image picker');
} else if (response.error) {
reject('ImagePicker Error: ', response.error);
} else if (response.camera) {
reject('User tapped custom button: ', response.camera);
} else {
const source = {uri: response.uri};
resolve(source);
}
})
}))
}
Вы можете оставить свой app.js таким же, как вы уже ждете, пока обещание разрешится с помощью «ожидания», что означает, что переменная данных приведет к объекту исходного результата из обещания.
спасибо, это сработало, вопрос, смогу ли я использовать ожидание вместо разрешения отклонения?