Loading data from the store if it exists

Loading our data from the store requires a couple of changes to our code. The first step is to check whether the structure exists in the store and if it does, load it. The second step is to only commit the data to storage if it is new data—calling the existing createFolderStructure method will update the structure but also re-commit the data to storage. Although not detrimental to the user as it currently stands, unnecessarily writing data to the store could cause issues when your app grows. This will also help us when we come to precaching the folders and files.

Loading the data from the store

As a store is a JavaScript object and our slug variable is a consistent computed value on our component, we can check whether the object key exists with an if statement:

if(this.$store.state.structure[this.slug]) {
  // The data exists
}

This gives us the flexibility to load the data from the store if it exists, using the createFolderStructure method and, if not...