value for uri cannot be cast from double to string

user_15330207 0
Viewed 2937

I want to set a default image before i can upload any image from my gallery here is my code

 state = {
        user: {
            avatar : require('../assets/user.png')

        }
    }
    handlePickAvatar = async () => {

        UserPermission.getCamerPermission()
        let result = await ImagePicker.launchImageLibraryAsync({
            mediaTypes : ImagePicker.MediaTypeOptions.Images,
            allowsEditing: true,
            aspect:[4,3]
        })
        if (!result.cancelled) {
            this.setState({ user: { ...this.state.user, avatar: result.uri } });
        }
    }
    render() {

        return (
            <View style={styles.container}>
                <Text style={styles.profile}>Profile</Text>
                <View style={styles.avatarPlaceholder} >
                    <Image source={{ uri: this.state.user.avatar }}  style={styles.avatar} />


                </View>
                <TouchableOpacity onPress={this.handlePickAvatar}>
                    <Text style={styles.text}>Load Image</Text>                    
                </TouchableOpacity>
            </View>
        );
    }

The results should be like this the user image must be defaulted but i get the error :value for uri cannot be cast from double to string

is there any solution for this ?

Thank you! Updated!!

react-native node.js
2 Answers

Check if user.avatar has the image then show the uploaded image. If it is not uploaded show the default image.

  <View style={styles.container}>
    <View style={styles.avatarPlaceholder}>
      <Image
        source={{ uri: this.state.user.avatar || 'default image path' }}
        style={styles.avatar}
      />
    </View>
    <TouchableOpacity onPress={this.handlePickAvatar}>
      <Text style={styles.text}>Load Image</Text>
    </TouchableOpacity>
  </View>
user_147096600

Use uri: this.state.user.avatar.toString() instead of uri: this.state.user.avatar and the error is gone.

Edit: your problem could've arised from the fact of loading in your store images with local paths via require('...'). In that scenario, the image is saved as a number.

user_111273830
Related