Struggling to grasp the concept of vue.js, I am currently navigating my way through understanding how to fetch or call an API. Setting up my index.html and app.js, along with the required packages in the node_modules, has been relatively smooth.
However, upon running my file, I encountered a frustrating
TypeError: Cannot read property 'get' of undefinedvar Vue = require('vue');
Vue.use(require('vue-resource'));
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<script src="https://unpkg.com/vue" ></script>
<title>article-app</title>
</head>
<body>
<div id="vue-app">
{{ articles }}
</div>
<script src="app.js"></script>
<script src="main.js" ></script>
</body>
</html>
var article = new Vue({
el: '#vue-app',
data: {
articles: ''
},
created: function () {
this.fetchData();
},
methods: {
fetchData: function () {
var that = this
this.$http.get('http://localhost/aim-beta/rest/export/json/article'),
function (data) {
this.articles = data.main.temp;
}
}
}
});