We need to access json files objects most of the time when we work on a project that use JSON to pass
data. If you want to access an external JSON file object in Vue.js what will you do?. First step is to load
the JSON file.
Assign the import to a data property.
import json from './json/data.json'
export default{
data(){
return{
myJson: json
}
}
}
Now use v-for and loop through myjson property in your template.
If the object you want to import is static then it would make no sense if you assign it to data property. It is
because vue converts all the properties in the data option to setter/getters for the properties to be
reactive.So create a custom option:
import MY_JSON from './json/data.json'
export default{
//custom option named myJson
myJson: MY_JSON
}
Then loop it using $options.
