As an experiment to understand async/await, I implemented the init function in a convoluted manner:
function init() {
console.log(1)
accountsStore.getAccounts().then(() => {
categoriesStore.getCategories().then(() => {
sheetItemStore.getSheetItems().then(() => {
accountsStore.getTotal().then(() => {
sheetItemStore.getTotals().then(() => {
balanceStore.getGrandTotal().then(() => {
console.log(8)
})
})
})
})
})
})
console.log(9)
}
All functions are structured like this:
async function getAccounts() {
let response = await axios.get(route('accounts.index', {'id': baseStore.balance.id}))
accounts.value = response.data
console.log(2)
}
I would like all functions in init to finish before rendering the view. However, the console shows 1,9,2,3,4,5,6,7,8. Is there a way to ensure that the code waits for the functions in init to complete?