Get 2024 Templates Mega Bundle!14 Bootstrap, Vue & React Templates + 3 Vector Sets
Get for 99$
Hide side bar from component Metronic Vue
Hello,
can i hide sidebar on specific menu or with compenent without toggle button on metronic vue?
im using metronic 8.
i want to hide sidebar when onMounted from component.
Thank you
Replies (3)
Hi,
Thank you for reaching out to us.
You can update layout configuration properties inside the onMounted and onUnmounted events.
Here is an example:
const store = useConfigStore();
onMounted(() => {
store.setLayoutConfigProperty(
"sidebar.default.minimize.desktop.enabled",
false
);
});
onUnmounted(() => {
store.setLayoutConfigProperty(
"sidebar.default.minimize.desktop.enabled",
true
);
});Regards,
Lauris Stepanovs,
Keenthemes Support Team
Hello, thank you for response.
I have tried as you informed, but it only makes the toggle button in the app bar hiding, not for sidebar.
here is my code
import { useConfigStore } from "@/stores/config"
export default defineComponent({
name : ....
setup(props, ctx) {
onMounted(async () => {
store.setLayoutConfigProperty(
"sidebar.default.minimize.desktop.enabled",
false
);
........
});
onUnmounted(() => {
store.setLayoutConfigProperty(
"sidebar.default.minimize.desktop.enabled",
true
);
});
.........
}
})Thank you
Hi,
Sorry for the late reply.
If you wish to completely remove the sidebar from the layout for certain routes, you can switch to the header-only layout using the following code.
const store = useConfigStore();
onMounted(() => {
store.setLayoutConfigProperty("general.layout", "light-header");
LayoutService.init();
});
onUnmounted(() => {
store.setLayoutConfigProperty("general.layout", "dark-sidebar");
LayoutService.init();
});Regards,
Lauris Stepanovs,
Keenthemes Support Team
