Nebucatnetzer
/
vuejs_course
Archived
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

add error handling

This commit is contained in:
Andreas Zweili 2021-03-27 20:28:03 +01:00
parent bcaff40fd7
commit eb570d8254
1 changed files with 14 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
2021-03-17_http-01-starting-setup/src/components/survey/UserExperiences.vue
View File

@ -7,7 +7,12 @@
>Load Submitted Experiences</base-button >Load Submitted Experiences</base-button
> >
</div> </div>
<ul> <p v-if="isLoading">Loading</p>
<p v-else-if="!isLoading && error">{{ error }}</p>
<p v-else-if="!isLoading && (!results || results.length === 0)">
No data to show
</p>
<ul v-else>
<survey-result <survey-result
v-for="result in results" v-for="result in results"
:key="result.id" :key="result.id"
@ -29,7 +34,9 @@ export default {
}, },
data() { data() {
return { return {
results: [] results: [],
isLoading: false,
error: null
}; };
}, },
methods: { methods: {
@ -39,6 +46,8 @@ export default {
'https://vue-http-demo-8a928-default-rtdb.europe-west1.firebasedatabase.app/surveys.json' 'https://vue-http-demo-8a928-default-rtdb.europe-west1.firebasedatabase.app/surveys.json'
) )
.then(response => { .then(response => {
this.isLoading = true;
this.error = null;
const data = response.data; const data = response.data;
const results = []; const results = [];
for (const id in data) { for (const id in data) {
@ -48,10 +57,13 @@ export default {
rating: data[id].rating rating: data[id].rating
}); });
} }
this.isLoading = false;
this.results = results; this.results = results;
}) })
.catch(error => { .catch(error => {
console.log(error); console.log(error);
this.isLoading = false;
this.error = 'Failed to fetch data - please try again later.';
}); });
} }
}, },