Welcome to the community! I'm excited to ask my first question here on StackOverflow.
I am currently working with vue.js-v2 and webpack. My goal is to ensure that data remains immutable for child components, which are loaded through the vue-router. This data needs to be accessible across different pages.
To achieve this, I am importing data from a JSON file and integrating it into vue using a "main.js" file:
//main.js
import Vue from 'vue'
...
import myData from './path/file.json' // [{},{},{}...]
Vue.prototype.$storage = myData
new Vue({ router, .....
In various components, I retrieve the data as follows:
//pageX.vue
...
this.componentVar = this.$storage.filter((x) => x.name === 'needName')
Although this approach seems to be effective, I have concerns about whether I am approaching it correctly. I worry that I might inadvertently duplicate data in components due to my limited knowledge of javascript :(