Topic: mdb-navbar fix for ssr in nuxt
Expected behavior Navbar should work with SSR
Actual behavior Using Navbar with SSR causing 'window is not defined' error.
Resources (screenshots, code snippets etc.)
Example component:
<template>
<mdb-navbar position="top" light>
<mdb-navbar-nav>
<span>DEMO</span>
</mdb-navbar-nav>
</mdb-navbar>
</template>
<script>
import {mdbNavbarNav, mdbNavbar} from 'mdbvue'
export default {
components: {mdbNavbarNav, mdbNavbar}
};
</script>
This simple component should work with SSR but it causes a 'window is not defined' error on the server side.
I came up with two solutions the first and not prefered one is to simply disable ssr for the
component by wrapping <mdb-navbar>
in <no-ssr>
tag.
The second and prefered solution involves a change of the mdb-navbar component.
Simply moving the content from the created()
livecycle event to the mounted()
livecycle event fixes the problem.
Magdalena Dembna staff premium answered 6 years ago
Hi, Firstly, thank you for drawing our attention to this problem. We will look into that as soon as possible and do our best to include this change in the future release. Kind regards, Magdalena
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- User: Free
- Premium support: No
- Technology: MDB Vue
- MDB Version: 5.2.0
- Device: PC/Laptop
- Browser: Chrome
- OS: MacOS
- Provided sample code: No
- Provided link: No