New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Wrong layoutName #7567
Comments
I'm also running into this, client-side renders only seem to render the default layout, while server-side renders seem to correctly render whatever is passed to the |
layoutName is always |
i think its version v2.13.0 make bug layout, maybe downgrade or wait for fix bug |
@usb248 thanks for the report, I'm looking into it. |
Thx @galvez , I look forward to the fix. |
Hey, here is my temporal workaround to handle this issue.
Agree, that's not a great solution, but if this bug is critical for you it should work fine until it's fixed. https://codesandbox.io/s/prod-forest-319td?file=/layouts/error.vue |
yes, i have the same issue |
Same issue with me. The initial server side render uses the correct layout but once you start navigating through the app with client side routing it renders the default layout. |
Let's closed when v2.13.1 lands, I am really sorry about this regression 😬 |
Here's another flavour of @taras1313's workaround: import {
defineComponent,
useContext,
getCurrentInstance
} from 'nuxt-composition-api'
export default defineComponent ({
layout: 'fullpage',
props: {
error: {
type: Object,
required: true
}
},
setup () {
const { route } = useContext()
// FIXME: https://github.com/nuxt/nuxt.js/issues/7567
onBeforeUnmount(() => {
const vm = getCurrentInstance()
if (!vm) {
return
}
const matched = route.value.matched[0]
vm.$nuxt.setLayout((matched?.components?.default as any)?.options?.layout || 'default')
})
}
}) Hope it helps until v2.13.1 gets released. Thanks for the fix @Atinux ! |
Hi! This should be fixed with v2.13.1. |
Hi @pi0, this issue is still present in 2.13.1. Using the workaround from @gnuletik or @taras1313 is not optimal as the layout change is visible (page components are loaded before the layout change). Is there a better workaround? |
There is someone of core team able to fix/understand this issue please ... ? 😟 |
@usb248 you codesandbox is working now with the latest version: https://u1rpq.sse.codesandbox.io/not-found and then navigate to home page I am not sure to understand what's the issue now 🤔 |
@jonian could you provide a reproduction please? It works perfectly for us: https://codesandbox.io/s/frosty-fog-homlr |
@Atinux, reproduction at https://codesandbox.io/s/fervent-hoover-bq5nq. I can also reproduce this with a new app locally. Home and About pages use the What fixes the issue for me is replacing https://github.com/nuxt/nuxt.js/blob/dev/packages/vue-app/template/client.js#L612 if (this._hadError) {
Vue.nextTick(() => {
this.setLayout(layout)
})
} else {
this.setLayout(layout)
} |
@Atinux, when error page uses the |
I do also have like @jonian Homepage is using orange layout, error page is using empty layout. When I hit go to homepage link from error page the layout is not updated to orange but remains the empty layout, but must be orange as set for homepage. Im using nuxt 2.13.1 If I do not assign a layout to the error page, everything works as expected. |
Bug still exists. The issue is that setLayout from App:render is being called for error layout when navigating from We are working to find a fix :) |
Hi. This should be (finally) fixed with v2.13.2 apologizes for all inconveniences due to this bug. |
Thanks, it's ok for me |
@pi0, @Atinux, PR #7606 causes wrong error layout when there are errors after the route is mounted (eg. 500 errors). Reproduction at https://codesandbox.io/s/affectionate-johnson-1bzfy, error pages should use the |
Version
v2.13.0
Reproduction link
https://u1rpq.sse.codesandbox.io/
Steps to reproduce
Go to an error page (ex: https://u1rpq.sse.codesandbox.io/not-found), open your debug console, click on home link, see wrong layout. Do hard refresh (F5), layoutName is good now (SSR ok)...
It can be related to #5703, #7554....
What is expected ?
layoutName should be :
front
What is actually happening?
layoutName value is:
default
, it displaysdefault
layout instead offront
layoutAdditional comments?
I use layoutName in order to stylize, it's a very big issue which break all my app.....
I'm missing something ?
The text was updated successfully, but these errors were encountered: