xct's notes
Search…
Quasar/Vuejs/Firebase

General

Update to latest quasar version:

1
npm i -g @quasar/[email protected]
Copied!

Lessons Learned

The best approach is to use Firestore directly in the app without a nodejs backend for most things. Vuexfire seems to be a good candidate to abstract a lot of hassle away for this.

Backend Query from .vue File:

1
methods: {
2
getPosts() {
3
this.$axios
4
.get(`${process.env.API}/posts`, {
5
headers: { Authorization: this.$q.localStorage.getItem("token") },
6
})
7
.then((resp) => {
8
this.posts = resp.data;
9
})
10
.catch((error) => {
11
if (error.response) {
12
if (error.response.status == 403) {
13
this.$q.localStorage.remove("loggedIn");
14
this.$q.localStorage.remove("token");
15
this.$router.push("/auth").catch((err) => {console.log(err)});
16
}
17
}
18
});
19
},
Copied!
When commiting to git, include .postcssrc.js manually or the quasar app will break.

JS Promises

A more elegant way to write asynchronous functions without using .then and .catch is this format:
1
const funcName = async() => {
2
const a = getA()
3
const b = getB()
4
const c = await Promise.all([a,b])
5
return c
6
}
Copied!
You could also await getA() and getB() separately, but they would not execute in parallel like in the example. This is useful if the value of B depends on A.
A good explanation can be found here: https://www.youtube.com/watch?v=vn3tm0quoqE
Last modified 1yr ago
Copy link