Subscribe to and display changes

[Yiagstar]

I am quite new to Svelte coming from an IOS background. I am currently trying to build a fairly simple application and am going around in circles trying to get my values to auto update when they are changed in my firebase database. My current code uses 3 pages and works to get the initial value but, anything I seem to try to get it to be reactive crashes my application. Could any of you helpful lot explain how to change my code to get it to work please? My code so far:

Getter.js
`
import { assignedUser } from "@stores/persistedStore";

async function getUser(thisUser) {

const docRef = doc(db, "userData", thisUser);
const userSnapshot = await getDoc(docRef);
const theUser = userSnapshot.data();

assignedUser.set({
    theUser
})

}

export { getUser };

**persistedStore.js**
import { persisted } from 'svelte-persisted-store'
export const assignedUser = persisted('assignedUser', {})
`

+page.svelte
`

<script> import { get } from 'svelte/store' import { assignedUser } from "@stores/persistedStore"; const singleUser = get(assignedUser); </script>

{singleUser.theUser.userWeight}

`

This code displays my users weight perfectly and persists across the pages as it should. I obviously need this to be reactive though without having to refresh the page. I know this is done through the subscribe method but am unsure of how to implement this properly? Could someone please point me in the right direction?

Thanks in advance

[webJose]

Are you asking "how do I always get the value in the database in the store?"? If yes, this is not a feature of this project.

As to how to do that, you'll have to trigger the call to the database somehow: The click of a button, or a timer, etc. Something.

[joshnuss]

Hi @Yiagstar,

I noticed you are using get(), probably should use the $ syntax.

I recommend reading up on it here:
https://svelte.dev/docs/svelte-components#script-4-prefix-stores-with-$-to-access-their-values

It will allow the updates to happen reactively.

I'm not knowledgeable about Firebase, but I'm sure they have an callback API that notified where objects change. I would also look into the code of Svelte projects using Firebase too.