jepiqueau / blog-tutorials-apps

Tutorials App for blog https://jepiqueau.github.io/
MIT License
7 stars 6 forks source link

On Tab reload data got lost. how to check data store location #5

Open sunilk44 opened 2 months ago

sunilk44 commented 2 months ago

I have followed the ionic7-vue-sqlite-app example and set the project accordingly had a problem when I tried to reload the current tab then the data got lost and gave an empty response

can you tell me at what location sqlite db stores the data and why it's getting lost I am working on ionic-vue PWA to store the serve data to work it offline (if the network is not available)

lsvalina commented 1 month ago

did you figure it out? i have same issue with ionic-react

jepiqueau commented 1 month ago

@sunilk44 Thanks for this, to solve this you must the windows beforeunload event in the setup() of the UsersPage.vue add the folowing code

      if(platform === "web") {
        window.addEventListener('beforeunload', (event) => {
          console.log("->> on beforeunload")

          sqliteServ.closeDatabase(dbNameRef.value, false)
          .then(() => {
            isDatabase.value = false;
          }).catch((error: any) => {
            const msg = `Error close database:
                          ${error.message ? error.message : error}`;
            console.error(msg);
            Toast.show({
              text: msg,
              duration: 'long'
            });
          });
        });        
      }

meaning each time you reload the database will be closed and the the data will be saved

@lsvalina the same could be done in react, angular or any framework