[Bug Report] When keep-alive, the height of the padding top is increased in <v-content> Tag even when the app bar has no extend.

[yoonjaepark]

Environment

Vuetify Version: 2.1.11
Last working version: 2.1.11
Vue Version: 2.5.22
Browsers: Chrome 78.0.3904.108
OS: Mac OS 10.15.1

Steps to reproduce

Both pages are keep-alive pages.
Press the button below to go to the page.

Expected Behavior

In the tag, the padding top size reinitialized.

Actual Behavior

In the tag, the padding top size is increased and not reinitialized

Reproduction Link

https://codesandbox.io/s/vue-template-wwwrb?fontsize=14&hidenavigation=1&theme=dark

[merceyz]

@johnleider The fix applied here breaks custom use of the applicationable mixin / application service. The fix makes it so that there can only be one applicationable top/left/right/bottom. Could the fix be reverted and instead use hardcoded uids for the components?

[eschirtz]

Hey, I'm still having an issue with this.

Switching to a layout without a side-nav drawer still get's the side nav drawer margins when changing screen size (side nav drawer exists in the component I "keep-alive").

Is there a way to tell the application service that v-app instances are different? I tried adding unique key props to each, but had no luck.

Thanks

[eschirtz]

I think I found a solution.

In the layout I use keep-alive on, I added the following lifecycle hooks

activated() {
    this.enableVuetify = true;
},
deactivated() {
    this.enableVuetify = false;
}

Then I conditionally render the app level components with a v-if directive. My understanding is that this will actually destroy those elements and allow the vuetify application service to clean up, or unregister them.

If there's a more standard or accepted way, I'd love to know, but this works for now!