How to properly store non-reactive and static data in an vue?

Question

Greetings to the community! This is my first question on the StackOverflow.

I use vue.js-v2 and webpack. I need to have immutable data available for child components. The components are loaded via the vue-router. Different pages need the same data.

I import data from a JSON file and integrate it into vue with a "main.js":

//main.js
import Vue from 'vue'
import ...
import myData from './path/file.json' // [{},{},{}...]
Vue.prototype.$storage = myData
new Vue({ router, .....

Then I use in different components something like:

//pageX.vue
...
this.componentVar = this.$storage.filter((x) => x.name === 'needName')

And somehow it works. I worry if I'm doing the right thing. I am afraid of duplicating data in components or something like that, because my knowledge of javascript is deplorable :(

Nishant S Vispute · Accepted Answer · 2021-05-08 21:19:56Z

0

You have to use Vuex to store that data.. wheater immutable or not a state of an app has to a single absolute source of truth and no alternative compared to vuex can help you in this case

answered May 8, 2021 at 21:19

Nishant S Vispute

7752 gold badges9 silver badges25 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

mamadu Over a year ago

Thank you, this is still too difficult for me and for my project.

Collectives™ on Stack Overflow

How to properly store non-reactive and static data in an vue?

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related