what is the best way to send an js object to firebase?

I am using functional component of react native fully. I've been using it for about 1 week now but I'm still trying to get used to typescript.So I have written a functional component of a TextInput called StyledTextInput, I have no idea if I am in the right direction, I use React.useState<string>(""); in the parent to update the text, however I noticed there is a slight delay when updating the text.I have a simple signup form, which will only be used 1 time:

1. phone number
2. gender
3. occupation
4. favoriteColor
5. favoriteSong

const [num, setNum]       = React.useState<number>(0);const [gender, setGender] = React.useState<string>("");const [job, setJob]       = React.useState<string>("");const [color, setColor]   = React.useState<string>("");const [song, setSong]     = React.useState<string>("");

So base on firebase documentation I see sending request is using Javascript Object right? https://rnfirebase.io/app/usage so to send an object I can imagine it look something like this?

function sendObject(){    const sendThis = { num: num, gender: gender, job: job, color: color, song: song };    firebase.database().ref(url).push(sendThis).}

The problem is there is some delay in set of useState. I am not looking for external library, I know there are external library like https://github.com/react-hook-form/react-hook-form but how do they store edit and send the object?
Is there a more elegant way to make sure the sendThis object is up to date? I am wondering is it possible to pass the object to the StyledTextInput and update the value accordingly? Please guide me how.