Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Integration with browser database (e.g. localforage) for offline access #272

Open
geoidesic opened this issue Oct 19, 2020 · 4 comments
Open

Comments

@geoidesic
Copy link

My application has an offline requirement. The way I'm managing that is I have vuex store plugin which persists the store via localforage when any mutation is run.

However. The question is how to recover data from the browser database. The scenario in which this would apply is when the application is offline, causing the reststate getters to return null and any actions to reject.

My initial solution was merging state when the store is initialised. However, as you've mentioned in other conversations, this breaks the modular nature of the store and it relies on state being an object and not a function.

So is there a recommended way of handling this? I assume that one should run a mutation, rather than a merge. However there isn't a provided mutation that simply replaces the entire store state, so that one can just take the entire store from the localforage copy and load it into the reststate store.

Can we add a mutation to support this? Should just be:

RESTORE: (state, data) => {
   state = data
}
@CodingItWrong
Copy link
Contributor

That problem makes sense.

I use vuex-persist on my own reststate app, and it's able to restore the state somehow even with the function-based state. I'm not sure what mechanism it uses. You may be interested in considering vuex-persist anyway as it's a nice way to handle persistence and restoration that may mean you don't have to write that code yourself.

Apart from vuex-persist, just to confirm: have you tried passing in the state property at the top level of the Vuex.Store() call? I'm not sure if it would override the modules' state, but that might be the mechanism vuex-persist uses:

Vuex.Store({
  state: () => ({…}),
  modules: {…},
})

If that doesn't work, I think I would be open to a mutation that would overwrite the state, as you suggested.

@geoidesic
Copy link
Author

Yes. It works!
Thanks for recommending vuex-persist and modular stores. It's all working so much better now that I have that concept in mind.

@geoidesic geoidesic reopened this Nov 12, 2020
@geoidesic
Copy link
Author

I have a follow up question wrt vuex-persist...

Given a specific @reststate action e.g. 'restaurants/loadAll` how do you manage offline caching so that the action will not run if the data it requires is already present? Like what strategy do you use for this?

@CodingItWrong
Copy link
Contributor

FYI, this library will be unmaintained going forward.

If you need new features or fixes, I recommend forking the repo and making changes, or finding an alternate library that meets your needs.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants