CODEWITHSUNDEEP
wordpressvue.jsvuejs2axiosvue-component
Thomas Alexander Woolff
Thomas Alexander Woolff

Reputation: 243

Vue.js Axios Wordpress call

Can anyone help me solve a problem with the following code? I want to get the posts data from my wordpress installation with Axios in my Vue.js project. I get the error: "...axios is not defined"

blog component:

<template>
  <section>
    <h1>Blog</h1>

    <ul>
    <li v-for="post of posts" :key="index">
      <p><strong>{{post.title}}</strong></p>
      <p>{{post.body}}</p>
    </li>
  </ul>

  </section>
</template>

<script>
export default {
  data(){
    return {
      posts: []
    }
  },
  created() {
    axios.get(`http://woolff.dk/blog/wp-json/wp/v2/posts`)
    .then(response => {
      this.posts = response.data
    })
  }
}
</script>

main.js:

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import axios from 'axios'
import VueAxios from 'vue-axios'

Vue.use(VueAxios, axios)

Vue.config.productionTip = false

new Vue({
  router,
  render: h => h(App)
}).$mount('#app')

Upvotes: 0

Views: 689

Answers (1)

Boussadjra Brahim
Boussadjra Brahim

Reputation: 1

You're missing this keyword before axios :

created() {
this.axios.get(`http://woolff.dk/blog/wp-json/wp/v2/posts`)
.then(response => {
  this.posts = response.data
})

Upvotes: 1

Related Questions