Keep getting: FirebaseError: Function DocumentReference.update() called with invalid data. Unsupported field value: a function

Question

I'm trying to update a field for a certain user when they fill out a certain TextInput. When I fill in the form, it updates the field in the Cloud Firestore. However, I keep getting warnings or errors:

A warning I get: Warning: Failed prop type: Invalid prop value of type array supplied to ForwardRef(TextInput), expected string.

The error I also sometimes get: FirebaseError: Function DocumentReference.update() called with invalid data. Unsupported field value: a function

I understand that this is probably also an issue with numbers vs Strings, but I tried converting my value to a String and no solution seemed to get rid of the warnings or errors.

Here's the code I'm using right now:

import React, { useState } from 'react'
import { Image, Text, TextInput, TouchableOpacity, View } from 'react-native'
import { KeyboardAwareScrollView } from 'react-native-keyboard-aware-scroll-view';
import styles from './styles';
import AsyncStorage from '@react-native-community/async-storage';


import { firebase, firebaseConfig, db } from '../../firebase/config'
import "firebase/auth";
import "firebase/firestore";


export default function MoreInfo({ navigation }) {
    var bp = useState(0)
    var age = useState(0)
    var monthsPreg = useState(0)

    //to properly save data 
    const user = firebase.auth().currentUser;


   
    const onSubmitPress = () => {
        db.collection("users").doc(user.uid).update(
            {
                hasOptedIn: true
            }
        )
       navigation.navigate('Home', { user })

    }
    return (
        <View style={styles.container}>
            <KeyboardAwareScrollView
                style={{ flex: 1, width: '100%' }}
                keyboardShouldPersistTaps="always">
                <Image
                    style={styles.logo}
                    source={require('../../../assets/icon.png')}
                />

                {<TextInput
                    style={styles.input}
                    placeholderTextColor="#aaaaaa"
                    secureTextEntry
                    placeholder='Blood Pressure'
                    keyboardType={'numeric'}
                    input type = "numeric"
                    value={bp}
                    onChangeText={
                        (text) => {
                        
                            const userRef = db.collection("users").doc(user.uid).update(
                              
                                {
                                    "bloodPresure": bp
                                }
                                
                            )
                                .then(function () {
                                    console.log("Document successfully updated!");
                                });

                        }}
                    
                    underlineColorAndroid="transparent"
                    autoCapitalize="none"
                />}
            
                <TouchableOpacity
                    style={styles.button}
                    onPress={() => onSubmitPress()}>
                    <Text style={styles.buttonTitle}>Submit Data</Text>
                </TouchableOpacity>
            </KeyboardAwareScrollView>
        </View>
    )
}

Answer 1

Both errors appear to be converging into the issue being that you are not passing the expected values on the TextInput and in the db.collection("users").doc(user.uid).update() function.

After checking the Official Documentation for TextInput in React Native I saw that there is no property named input type described there. I assume this is the root cause of the issue, try removing this property and it will force the value to became a string that can be properly updated to the Firestore Document.

Answer 2

db.collection("users").where("passcode", "==", passcode).limit(1).get().then(query => {
                console.log(query);
                const thing = query.docs[0];
                console.log(thing.data());
                let tmp = thing.data();
                tmp.current_game_play = tmp.current_game_play + 1;
                console.log(tmp);
                thing.ref.update(tmp);
            });