jsonvue.jsaxiosvue-cli

VUE.JS receive a json file from url via axios in webpack-simple


I am new to vue.js and I try to recieve the list from url. There are some problems here:
1. I can't define the axios in main.js so I can use it in index.html (this solution doesn't work for me https://stackoverflow.com/a/51374448/9582441)
2. When I use console.log(response), the response is empty, thus the request havn't been done

I've installed axios and vue threw the vue-cli

main.js

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

Vue.use(VueAxios, axios);

new Vue({
  el: '#app',
  render: h => h(App)
})

index.html

<template>
  <div id="app">{{ info }}</div>
</template>

<script>
export default {
  name: "app",
  data() {
    return {
      info: null
    };
  },
  mounted() {
    Vue.axios
      .get("https://dog.ceo/api/breeds/list/all"
      )
      .then(response => (this.info = response));
    console.log(response);
  }
};

So that I just want to recieve a list and connect the axios somehow

Soultion is to use

this.axios


Solution

  • the solution was to use

    this.axios