Rerendering component when any object keys change

I have an user object with all user data inside. This object changes whenever anything changes in the database.

const [userData, setUserData] = useState(null) //will become an object when filled with user data

I then pass this as a prop in my Navbar component so I can display the data.

<Navbar key={userData} user={userData}/>

I can’t use the whole userData object as a key like shown above, and the component won’t rerender otherwise. We don’t know which value will change in the database, so I can’t give an exact key.

How can I update the Navbar when any value changes in the userData object?