diff --git a/frontend_nuxt/components/MenuComponent.vue b/frontend_nuxt/components/MenuComponent.vue
index e3bbde811..3f78ecfa4 100644
--- a/frontend_nuxt/components/MenuComponent.vue
+++ b/frontend_nuxt/components/MenuComponent.vue
@@ -71,7 +71,7 @@
-
+
@@ -93,7 +93,7 @@
-
+
{{ t.name }} x {{ t.count
@@ -127,40 +127,35 @@ export default {
}
},
async setup(props, { emit }) {
- // `useRouter` must be called before any `await` to retain Nuxt instance
const router = useRouter()
-
const categories = ref([])
const tags = ref([])
const categoryOpen = ref(true)
const tagOpen = ref(true)
- const { data: categoryData, pending: isLoadingCategory } = await fetch(
- `${API_BASE_URL}/api/categories`,
- { server: true }
- )
- const { data: tagData, pending: isLoadingTag } = await fetch(
- `${API_BASE_URL}/api/tags?limit=10`,
- { server: true }
- )
+ const isLoadingCategory = ref(false)
+ const isLoadingTag = ref(false)
+ const categoryData = ref([])
+ const tagData = ref([])
- watch(
- categoryData,
- (val) => {
- categories.value = (val || []).slice(0, 10)
- },
- { immediate: true }
- )
- watch(
- tagData,
- (val) => {
- tags.value = val || []
- },
- { immediate: true }
- )
+ const fetchCategoryData = async () => {
+ isLoadingCategory.value = true
+ const res = await fetch(`${API_BASE_URL}/api/categories`)
+ const data = await res.json()
+ categoryData.value = data
+ isLoadingCategory.value = false
+ }
+
+ const fetchTagData = async () => {
+ isLoadingTag.value = true
+ const res = await fetch(`${API_BASE_URL}/api/tags?limit=10`)
+ const data = await res.json()
+ tagData.value = data
+ isLoadingTag.value = false
+ }
onMounted(() => {
- localStorage.setItem('menu-categories', JSON.stringify(categories.value))
- localStorage.setItem('menu-tags', JSON.stringify(tags.value))
+ // fetchCategoryData()
+ // fetchTagData()
})
const iconClass = computed(() => {
@@ -226,9 +221,11 @@ export default {
handleItemClick()
}
+ await Promise.all([fetchCategoryData(), fetchTagData()])
+
return {
- categories,
- tags,
+ categoryData,
+ tagData,
categoryOpen,
tagOpen,
isLoadingCategory,
diff --git a/frontend_nuxt/pages/index.vue b/frontend_nuxt/pages/index.vue
index 3229345e7..750aa6552 100644
--- a/frontend_nuxt/pages/index.vue
+++ b/frontend_nuxt/pages/index.vue
@@ -376,8 +376,7 @@ export default {
const sanitizeDescription = text => stripMarkdown(text)
- await loadOptions()
- await fetchContent()
+ await Promise.all([loadOptions(), fetchContent()])
return {
topics,