Get Data From Local Json File In Vuejs Method Using JQuery $.getJSON()
I'm working on a demo app using Vuejs, and as part of it, I need to get some map data from a local .json file, get certain parts of it (such as lat/long values), and then put it in
Solution 1:
I'm not sure where do you want to access this outside the function.
For example, you can assign result of $.getJSON
to Vue's instance data by self.data = data
, then you can access it outside of your $.getJSON
export default {
name: 'HelloWorld',
data () {
return {
center: {lat: 37.541885, lng: -77.440624},
markers: [],
data: null
}
},
methods: {
getMarkers: function () {
var apparatus = {}
var address = []
var description = {}
var self = this
$.getJSON('../static/event1.json', function (data) {
self.data = data // then you can access data outside of your function by reference this.data
// What do I do here to get outside of this function so
// I can manipulate it?
apparatus = data.apparatus
address = data.address
description = data.description
})
}
},
created () {
this.getMarkers()
}
}
Solution 2:
I think you are looking for a way to use your data object's inside your method. You can use this
to get access to your data object's :
this.markers = data;
UPDATE :
In your case, you have another scope in your method ( Your callback ) so you ned to use View Model. just before your getJSON line, define it like this :
var vm = this;
Then inside your callback, you can have access to your data object :
vm.markers = data;
notice that if you are using the older version's of vue ( below 2.x ) , you need to use it like this :
this.$data.markers = data;
Post a Comment for "Get Data From Local Json File In Vuejs Method Using JQuery $.getJSON()"