diff --git a/src/composables/useToolbar.ts b/src/composables/useToolbar.ts index 9f90756..d92b548 100644 --- a/src/composables/useToolbar.ts +++ b/src/composables/useToolbar.ts @@ -28,12 +28,23 @@ export interface ToolbarConfig { // --- Global reactive config — views write on mount/unmount, toolbar reads --- // Cannot use provide/inject: AppToolbar is a sibling of , not a descendant. +// +// Version counter: Vue Router may mount the new component before unmounting the old one. +// Without this, the old component's onUnmounted would clear config set by the new component. const _config = ref(null); +let _mountVersion = 0; export function provideToolbar(config: ToolbarConfig) { - onMounted(() => { _config.value = config; }); - onUnmounted(() => { _config.value = null; }); + let myVersion = 0; + onMounted(() => { + myVersion = ++_mountVersion; + _config.value = config; + }); + onUnmounted(() => { + // Only clear if no newer component has taken ownership since we mounted. + if (myVersion === _mountVersion) _config.value = null; + }); } export function injectToolbar(): Ref {