Caching the Current Folder Structure Using Vuex Chapter 6As mentioned, Vuex is a state management pattern, which is the source of truth for your
Vue app. For example, keeping track of a shopping basket or logged in user is vital for
some apps and could wreak havoc if this data got out of sync between components. It is
also impossible to pass data between child components without using the parent to handle
the exchange. Vuex removes this complication by handling the storage, mutation, and
actions on the data.
When initially using Vuex, it may seem quite verbose and like overkill for what is required;
however, this is a great example of getting to grips with the library. More information
about Vuex can be found in their documentation.
For our Dropbox app, the Vuex store can be utilized to store the folder structure, file list,
and download links. This means if a user visits the same folder more than once, the API
will not need to be queried as all the information is stored already. This will speed up the
navigation of the folders.