I am currently facing an issue when trying to call the API from my external.js file in Vuejs. I am using axios to make the API call and then displaying the data using v-for inside my component. However, I keep getting an error stating that axios is defined but never used.
The endpoint URL that I want to call inside my data.js file is:
If you want to see the code that is working, you can check it out at this link: https://codesandbox.io/s/blissful-northcutt-wze8i?file=/src/components/data.js
data.js
export default {
methods: {
mydata() {
axios.get("https://randomuser.me/api/").then((response) => this.response);
}
}
};
HelloWorld.vue
<template>
<div>
<div v-for="list in lists" :key="list.id">
{{ list.name }}<br />{{ list.location }}
</div>
</div>
</template>
<script>
import axios from "axios";
import { mydata } from "./data";
export default {
name: "HelloWorld",
data() {
return {
lists: mydata,
};
},
};
</script>