After introducing mock into vue-cli, the request Datagram error axios is not defined.

//main.js
import Vue from "vue"
import App from "./App"
import router from "./router"
import axios from "axios"


Vue.config.productionTip = false;
Vue.prototype.$ajax = axios;


/* eslint-disable no-new */
new Vue({
  el: "-sharpapp",
  router,

  components: { App },
  template: "<App/>"
})
//HelloWorld
<script>
  import "../mock/mock"
  export default {
    name: "HelloWorld",
    data () {
      return {
        msg:"hello world",
        data:[]
      }
    },
    mounted:function () {
      console.log(111);
      this.getList()
    },
    methods:{
      getList(){
        this.$axios.get("/api/data").then((res)=>{
          console.log(res);
        })
      }
    }
  }
</script>
//mock.js
import Mock from "mockjs"
//mockjs
Mock.mock("/api/data", (req, res) => {
  return {
    data: ["a","b"]
  }
})

clipboard.png

No matter how the consistent error is not defined ~ where is it not configured for advice? This article referenced by
https://codeshelper.com/a/11.

Mar.30,2021

this.$axios.get('/api/data').then((res)=>{
  console.log(res);
})
Change

to

this.$ajax.get('/api/data').then((res)=>{
  console.log(res);
})

went through a lot of articles, and finally found the problem.

//helloworld
  import axios from 'axios'//main.js    

where to call

this.$axios.get('/api/data').then((res)=>{
          console.log(res);
        })
Change

to

axios.get('/api/data').then((res)=>{
          console.log(res);
        })

this.$ajax.get('/api/data').then((res)=>{
  // ...
})

what's tied to your Vue prototype chain is $ajax

.
Menu