Vue和Axios，这个回调的东西让我很困惑.错误:'v-on处理程序中出错:"TypeError:无

Question

所以，我是一个新的Vue和JS编码器(c++和c#(我有一个Vue应用程序，在v-onclick中有一个按钮，它在Vue实例上调用一个方法。

在那个方法中，它使用了轴子。然后承诺。

在之前的一个问题之后，我通过将then转换为箭头函数，在我的第一个应用程序中实现了它。

我花了很多时间深入研究JavaScripts"这个"；问题，并获得点击事件->axios承诺链做了一些奇怪的事情，这意味着。。。

已将整个Vue视图页面复制到一个新应用程序。不工作

正在获取此错误。

vue.runtime.esm.js？2b0e:619[Vue warn]：v-on处理程序出错："；TypeError:无法读取未定义的"的属性"success"；

在中找到

> ---> <VBtn>
>        <VCard>
>          <VForm>
>            <StudentPortalData> at src/views/StudentPortalData.vue
>              <VMain>
>                <VApp>
>                  <App> at src/App.vue
>                    <Root> warn @ vue.runtime.esm.js?2b0e:619 logError @ vue.runtime.esm.js?2b0e:1884 globalHandleError @
> vue.runtime.esm.js?2b0e:1879 handleError @
> vue.runtime.esm.js?2b0e:1839 invokeWithErrorHandling @
> vue.runtime.esm.js?2b0e:1862 invoker @ vue.runtime.esm.js?2b0e:2179
> invokeWithErrorHandling @ vue.runtime.esm.js?2b0e:1854 Vue.$emit @
> vue.runtime.esm.js?2b0e:3882 click @ VBtn.ts?0eff:158
> invokeWithErrorHandling @ vue.runtime.esm.js?2b0e:1854 invoker @
> vue.runtime.esm.js?2b0e:2179 original._wrapper @
> vue.runtime.esm.js?2b0e:6911 vue.runtime.esm.js?2b0e:1888 TypeError:
> Cannot read property 'success' of undefined
>     at VueComponent.validate (StudentPortalData.vue?ad47:84)
>     at click (eval at ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"317935a6-vue-loader-template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/views/StudentPortalData.vue?vue&type=template&id=7c5f5f87&
> (app.js:992), <anonymous>:61:38)
>     at invokeWithErrorHandling (vue.runtime.esm.js?2b0e:1854)
>     at VueComponent.invoker (vue.runtime.esm.js?2b0e:2179)
>     at invokeWithErrorHandling (vue.runtime.esm.js?2b0e:1854)
>     at VueComponent.Vue.$emit (vue.runtime.esm.js?2b0e:3882)
>     at VueComponent.click (VBtn.ts?0eff:158)
>     at invokeWithErrorHandling (vue.runtime.esm.js?2b0e:1854)
>     at HTMLButtonElement.invoker (vue.runtime.esm.js?2b0e:2179)
>     at HTMLButtonElement.original._wrapper (vue.runtime.esm.js?2b0e:6911) logError @ vue.runtime.esm.js?2b0e:1888
> globalHandleError @ vue.runtime.esm.js?2b0e:1879 handleError @
> vue.runtime.esm.js?2b0e:1839 invokeWithErrorHandling @
> vue.runtime.esm.js?2b0e:1862 invoker @ vue.runtime.esm.js?2b0e:2179
> invokeWithErrorHandling @ vue.runtime.esm.js?2b0e:1854 Vue.$emit @
> vue.runtime.esm.js?2b0e:3882 click @ VBtn.ts?0eff:158
> invokeWithErrorHandling @ vue.runtime.esm.js?2b0e:1854 invoker @
> vue.runtime.esm.js?2b0e:2179 original._wrapper @
> vue.runtime.esm.js?2b0e:6911

按钮：

<v-row wrap class="pr-2 my-2">
<v-layout>
<v-spacer></v-spacer>
<v-btn tile color="primary"
:disabled="!isFormValid"
v-on:click="validate()"
class="mr-1">
Get the stuff from the thing
</v-btn>
</v-layout>
</v-row>

方法Vue对象上的对象

methods: {
validate() {
this.$log.success("validate - in");
this.fetchData();
},
fetchData: () => {// was function ()
let vuethis = this;// hope hack
vuethis.isloading = true;
vuethis.$log.success("fetchData - in");
const obj = {};
obj.Url = vuethis.API_URL + "AdStudent/?";
obj.StudentAdName = this.adNameIn
axios.get(obj.Url + "StudentAdName=" + obj.StudentAdName)
.then(response => {
vuethis.info = response.data;
vuethis.isloaded = true;
})
.catch(function (error) {
vuethis.$log.error(error);
});
this.isLoading = false;
},
},

我找到了这篇文章，并尝试了列出的所有3个选项，但我仍然收到错误。。。。

访问VUE JS'；s Axios 的数据

我知道问题是"；Javascript Scope and Closure"；，我已经读了5-6篇关于这方面的文章。。。

我不知道的是为什么标准答案在这里不起作用。。。(尤其是当页面/视图/代码在我的其他应用程序中工作时(

我对Vue和非Basic JS都很陌生，所以这可能是一个愚蠢的错误——我对这种语言太熟悉了，无法理解。。。。

Answer 1

试试这个：

...
async fetchData()  {
this.isloading = true;
this.$log.success("fetchData - in");
const obj = {};
obj.Url = this.API_URL + "AdStudent/?";
obj.StudentAdName = this.adNameIn 

let result = await axios.get(obj.Url + "StudentAdName=" + obj.StudentAdName)
.then(response => response.data)
.catch(e => e.response)
//Before proceding we first check if there is any error on the http response, you can check that with the status
if(result.status === 500) { //status could be 422,400 or any other 
console.log(result)
this.isLoading = false;
return;
}
this.info = result;
this.isLoading = false;
return;
},