`), it would be ideal if the parent's fetch/asyncData functions ran _before_ the children. Currently, they all seem to fire at once (even if `async/await` is used). Please correct me if I am wrong here.\r\n\r\nFor example, in the [routing docs](https://nuxtjs.org/guide/routing), we'd want `category` to complete its fetch _before_ `subCategory` ran its fetch. That would make the parent `category` data available to the `subCategory` (eg. via the store). \r\n\r\nWithout this sequence, if you deep link to the `subCategory`, the parent `category` data may not have been set yet; preventing route checks that depend on that parent data, and/or the ability to append more granular data (unless dummy placeholders are added to the store). This essentially requires the `subCategory` to load the `category` data as part of the fetch; which results in the same data being loaded twice (once for the `category` and once for the `subCategory`).\r\n\r\nThoughts?\n\n\u003C!--cmty-->\u003C!--cmty_prevent_hook-->\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This question is available on \u003Ca href=\"https://nuxtjs.cmty.io\">Nuxt.js\u003C/a> community (\u003Ca href=\"https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c2457\">#c2457\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[2041,2044,2046],{"name":2042,"color":2043},"good first issue","fbca04",{"name":2045,"color":1989},"stale",{"name":2047,"color":2048},"2.x","d4c5f9",2825,"Sequence fetch/asyncData for nested route pages","2023-02-06T11:25:08Z","https://github.com/nuxt/nuxt/issues/2825",0.75375813,{"description":2055,"labels":2056,"number":2060,"owner":1991,"repository":1992,"state":2021,"title":2061,"updated_at":2062,"url":2063,"score":2064},"### Environment\n\n- Operating System: Darwin\n- Node Version: v23.7.0\n- Nuxt Version: 3.16.2\n- CLI Version: 3.24.1\n- Nitro Version: 2.11.8\n- Package Manager: npm@11.1.0\n- Builder: -\n- User Config: devtools, components, modules, css, ui, runtimeConfig, site, metaTracking, sitemap, schemaOrg, plausible, uiPro, nitro, future, sourcemap, compatibilityDate\n- Runtime Modules: @nuxt/ui-pro@3.0.2, @nuxt/eslint@0.4.0, @pinia/nuxt@0.5.5, @nuxt/image@1.10.0, @testit-sdk/nuxt@1.0.2, @nuxtjs/seo@3.0.2, @nuxtjs/plausible@1.2.0\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.0.2\n\n### Reproduction\n\n```app.config.ts\ntabs: {\n variants: {\n color: {\n white: '',\n },\n },\n //@ts-ignore\n compoundVariants: [{ color: 'white', variant: 'pill', class: { indicator: 'bg-white text-black shadow-md' } }],\n },\n```\n\n### Description\n\nHi!\n\nI'm trying to add custom variants to my `app.config.ts` but whenever I use it, I get a TS error saying the value is not working. The variant itself works fine, it's just that it shows a TS error\n\nWould be nice to have types automatically generated based on our custom variants :)\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2057,2058,2059],{"name":1985,"color":1986},{"name":2005,"color":2006},{"name":1988,"color":1989},3834,"Custom variant's types not working","2025-04-09T12:08:23Z","https://github.com/nuxt/ui/issues/3834",0.7661157,{"description":2066,"labels":2067,"number":2069,"owner":1991,"repository":1991,"state":2021,"title":2070,"updated_at":2071,"url":2072,"score":2073},"Hi all! I'm seeing what looks like a bug related to nested routes. I'm using vue-apollo, and my folder structure under /pages is as follows:\r\n\r\n```\r\nindex.vue\r\n_community.vue\r\n_community/_post.vue\r\n_community/index.vue\r\n```\r\nWhen navigating from index.vue -> _community/index.vue -> _post.vue - it works perfectly, with _post appearing via \u003Cnuxt-child />\r\n\r\nwhen directly loading _community/index.vue -> _post.vue, or _community/_post -> to another _post.vue, _post.vue itself renders correctly via \u003Cnuxt-child /> - but the parent component _community/index.vue loses it's data, so all of it's elements requiring data disappear.\r\n\r\nany ideas?\n\n\u003C!--cmty-->\u003C!--cmty_prevent_hook-->\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This question is available on \u003Ca href=\"https://nuxtjs.cmty.io\">Nuxt.js\u003C/a> community (\u003Ca href=\"https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c1239\">#c1239\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[2068],{"name":2047,"color":2048},1397,"Nested Routes: Odd behavior","2023-01-18T15:41:44Z","https://github.com/nuxt/nuxt/issues/1397",0.7857233,{"description":2075,"labels":2076,"number":2081,"owner":1991,"repository":1992,"state":2021,"title":2082,"updated_at":2083,"url":2084,"score":2085},"### Environment\n\n- Operating System: Darwin\r\n- Node Version: v18.18.2\r\n- Nuxt Version: 3.13.1\r\n- CLI Version: 3.13.1\r\n- Nitro Version: 2.9.7\r\n- Package Manager: bun@1.1.24\r\n- Builder: -\r\n- User Config: devtools, modules, eslint, runtimeConfig, site, mdc, image, components, strapi, i18n, vite, routeRules, formkit, compatibilityDate\r\n- Runtime Modules: @nuxtjs/strapi@1.12.0, @nuxt/image@1.8.0, @vueuse/nuxt@10.11.1, @nuxtjs/i18n@8.5.1, @nuxt/eslint@0.3.13, @nuxt/fonts@0.7.2, @nuxtjs/mdc@0.8.3, @formkit/nuxt@1.6.5, nuxt3-vuex-module@1.1.0, nuxt3-interpolation/index.cjs, nuxt-swiper@1.2.2, nuxt-marquee@1.0.4, @nuxtjs/seo@2.0.0-rc.20, @formkit/nuxt@1.6.5, @nuxt/ui@2.18.4\r\n- Build Modules: -\n\n### Version\n\nv2.18.4\n\n### Reproduction\n\nhttps://stackblitz.com/edit/github-dbk9vy?file=app.vue\n\n### Description\n\nEnter transition of sliderover Module not working properly. Instant appearing of elements (with sometimes slight but too quick transitions). Exit transition works fine. \r\n\r\nTried on Chrome, Firefox & Safari on Mac.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2077,2078],{"name":1985,"color":1986},{"name":2079,"color":2080},"upstream","78bddb",2127,"[Slideover/Modal] Enter transition not working","2024-09-20T14:03:47Z","https://github.com/nuxt/ui/issues/2127",0.7867777,{"description":2087,"labels":2088,"number":2092,"owner":1991,"repository":1991,"state":2021,"title":2093,"updated_at":2094,"url":2095,"score":2096},"Hi,\r\n\r\nIt seems that loading async data is pretty easy from pages, yet I don't find any way to load data asynchronously from nested components.\r\n\r\nTo explain what I try to do, I made some example project: https://github.com/Xowap/nuxttest\r\n\r\nYou'll see that data loaded from `index.vue` is correctly rendered server-side yet data in `HttpBin.vue` isn't displayed at all and triggers an error.\r\n\r\nIs that an anti-pattern? A feature to come?\r\n\r\nThanks,\r\nRémy\n\n\u003C!--cmty-->\u003C!--cmty_prevent_hook-->\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This question is available on \u003Ca href=\"https://nuxtjs.cmty.io\">Nuxt.js\u003C/a> community (\u003Ca href=\"https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c24\">#c24\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[2089,2091],{"name":2030,"color":2090},"cc317c",{"name":2047,"color":2048},32,"Async data in nested component","2023-01-18T15:38:24Z","https://github.com/nuxt/nuxt/issues/32",0.7878774,{"description":2098,"labels":2099,"number":2106,"owner":1991,"repository":1991,"state":2021,"title":2107,"updated_at":2108,"url":2109,"score":2110},"### Environment\n\nrc-13\r\nnode-18\n\n### Reproduction\n\n//composable\r\n```javascript\r\nconst myfetch = async (url,options,emits) => {\r\n const { data, pending, error, refresh } = await useFetch(url, {\r\n \r\n ...options,\r\n baseURL: useRuntimeConfig().API_URL, \r\n initialCache: false,\r\n headers: new Headers({ 'authorization': (process.client)?localStorage.getItem(\"token\"):''}),\r\n onResponse ({ response }) {\r\n return response._data\r\n },\r\n onResponseError ({ response }) {\r\n return response._data\r\n }\r\n })\r\n const resData = data.value\r\n \r\n return resData\r\n }\r\n```\r\n//component 1\r\n\r\n```javascript\r\n\u003Cscript setup>\r\ngetAllItems();\r\nasync function getAllItems() {\r\n let response = await myfetch('/article/artPosts?' +\r\n 'page=' + page.value + '&' +\r\n 'artPostGroup=' + artPostGroup.value + '&' +\r\n 'limit=' + limit.value, {\r\n method: 'GET'\r\n });\r\n if (response.data)\r\n list.value = response.data.docs;\r\n pages.value = response.data.pages;\r\n}\r\n\u003C/script>\r\n```\r\n\r\n//component 2\r\n\r\n```javascript\r\n\u003Cscript setup>\r\ngetAllItems();\r\nasync function getAllItems() {\r\n let response = await myfetch('/store/storeCourses?' +\r\n 'page=' + page.value + '&' +\r\n 'storeCourseGroup=' + storeCourseGroup.value + '&' +\r\n 'limit=' + limit.value, {\r\n method: 'GET'\r\n });\r\n if (response.data)\r\n list.value = response.data.docs;\r\n pages.value = response.data.pages;\r\n}\r\n\u003C/script>\r\n```\r\n//home.vue\r\n```javascript\r\n\u003Cdiv>\r\n\u003Ccomponent1>\u003C/component1>\r\n\u003Ccomponent2>\u003C/component2>\r\n\u003C/div>\r\n```\n\n### Describe the bug\n\nthe bug is here...\r\nin the page load:\r\nresponse of component1 is the same as response of component2...\r\n\r\n\r\nwhen i use $fetch instead of useFetch, it works good but it makes another problem for me...\r\n\r\non refreshing page,it send a request twice to server\r\n\n\n### Additional context\n\nhow can i write function in composables?\n\n### Logs\n\n_No response_",[2100,2103],{"name":2101,"color":2102},"3.x","29bc7f",{"name":2104,"color":2105},"pending triage","E99695",15451,"UseFetch() calling multiple request, only the last data is fetched and $fetch send requests twice","2023-01-19T17:50:37Z","https://github.com/nuxt/nuxt/issues/15451",0.78870714,["Reactive",2112],{},["Set"],["ShallowReactive",2115],{"TRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"dCRrgUwlA50ipCVW87DDRcpj7L82g--qx8vV1S42qd8":-1},"/nuxt/ui/3791"]