问题描述
在 react-native-image-picker 上将“ImagePicker.launchImageLibrary”更新为“launchImageLibrary”后。我收到一个新错误,我无法将照片保存到 firebase。请有人帮助我。在实时数据库中,firebase 是“未定义的”
import React,{useState} from 'react';
import {Image,StyleSheet,Text,TouchableOpacity,View}
from 'react-native';
import {launchImageLibrary} from 'react-native-image-
picker';
import {IconAddPhoto,IconRemovePhoto,ILNullPhoto} from
'../../assets';
import {Button,Gap,Header,Link} from
'../../components';
import {Fire} from '../../config';
import {colors,fonts,showError,storeData} from
'../../utils';
const UploadPhoto = ({navigation,route}) => {
const {fullName,profession,uid} = route.params;
const [photoForDB,setPhotoForDB] = useState('');
const [hasPhoto,setHasPhoto] = useState(false);
const [photo,setPhoto] = useState(ILNullPhoto);
const getimage = () => {
launchImageLibrary(
{quality: 0.5,maxWidth: 200,maxHeight: 200},response => {
if (response.didCancel || response.error) {
showError('oops,sepertinya anda tidak memilih foto
nya?');
} else {
const source = {uri: response.uri};
setPhotoForDB(`data:${response.type};base64,${response.data}`);
setPhoto(source);
setHasPhoto(true);
}
},);
};
const uploadAndContinue = () => {
Fire.database()
.ref('users/' + uid + '/')
.update({photo: photoForDB});
const data = route.params;
data.photo = photoForDB;
storeData('user',data);
navigation.replace('MainApp');
};
return (
<View style={styles.page}>
<Header title="Upload Photo" />
<View style={styles.content}>
<View style={styles.profile}>
<TouchableOpacity style={styles.avatarWrapper}
onPress={getimage}>
<Image source={photo} style={styles.avatar} />
{hasPhoto && <IconRemovePhoto style=
{styles.addPhoto} />}
{!hasPhoto && <IconAddPhoto style={styles.addPhoto}
/>}
</TouchableOpacity>
<Text style={styles.name}>{fullName}</Text>
<Text style={styles.profession}>{profession}</Text>
</View>
<View>
<Button
disable={!hasPhoto}
title="Upload and Continue"
onPress={uploadAndContinue}
/>
<Gap height={30} />
<Link
title="Skip for this"
align="center"
size={16}
onPress={() => navigation.replace('MainApp')}
/>
</View>
</View>
</View>
);
};
export default UploadPhoto;
const styles = StyleSheet.create({
page: {flex: 1,backgroundColor: colors.white},content: {
paddingHorizontal: 40,paddingBottom: 64,flex: 1,justifyContent: 'space-between',},profile: {
alignItems: 'center',justifyContent: 'center',avatar: {width: 110,height: 110,borderRadius:
110 / 2},avatarWrapper: {
width: 130,height: 130,borderWidth: 1,borderColor: colors.border,borderRadius: 130 / 2,alignItems: 'center',addPhoto: {position: 'absolute',bottom: 8,right: 6},name: {
fontSize: 24,color: colors.text.primary,fontFamily: fonts.primary[600],textAlign: 'center',profession: {
fontSize: 18,fontFamily: fonts.primary.normal,color: colors.text.secondary,marginTop: 4,});
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)