类型错误：无法使用 vue.js 和 axios 读取未定义的属性“post”

Question

我正在尝试通过 vue 方法中的 axios 帖子传递数据并收到错误消息：

“signinVue.js:60 未捕获的类型错误：无法读取未定义的属性‘post’”

Vue 脚本：

new Vue({
    el:'#app',
    data:{
        email:'',
        code:'',
    },
    methods:{
        signin:function(){
            console.log(this.email + ' ' + this.access);
            let url = '../App/testConnection.php';
            this.axios.post(url, {email:this.email, code:this.code})
                .then((response) =>{
                  console.log(response);
                })
                .catch(function (error) {
                    console.log(error);
                });
                //console.log(this.email + ' ' + this.access);
                //alert(this.email);
        }
    }
});

Answer 1

Axios 通常被注册为一个全局变量，所以，而不是：

this.axios.post(url, {email:this.email, code:this.code})

你应该使用：

axios.post(url, {email:this.email, code:this.code})

注意this.不见了。

注意：如果你真的想通过 使用 Axios this.axios，你应该将它添加到Vue原型中，如下所示：

Vue.prototype.axios = window.axios; // this will enable this.axios inside Vue instances
new Vue({
// ...

但这是一种不好的做法。如果您要像这样向 Vue 原型添加属性，建议的方法是使用 a$或_前缀，例如：

Vue.prototype.$axios = window.axios; // this will enable this.$axios inside Vue instances

因为如果您设置Vue.prototype.axios，它可能会与您命名的某些（不太可能，是的）数据属性冲突axios，例如 : data:{email:'', code:'', axios: 'w00t'},。