我创建了一个全局组件，可以在多条路线中共享。我已简化了以下组件以进行演示。
#name area-wrapper
<template>
<div id="area">
<div id="area-menu">
<menu/>
</div>
<div id="area-content">
<slot/>
</div>
</div>
</template>
在菜单中是一个导航栏，其中的选项会更改slot的内容，我可以将其转换为component v-bind:is组件。
我完成的工作创建了多个路由页面
pages
_entity <--*** forgot to include this ***
app
index.vue
_appId.vue
new.vue
这些页面中的每个页面都包含上面的组件，然后为id="area-content添加其自己的内容
我一直注意到的是，当我从中移出时，整个area-wrapper正在重新加载
website.com/app/112 (pages/app/_appId.vue)website.com/app/11 (pages/app/_appId.vue)[我注意到，如果我将area-wrapper移至布局，那么它起作用了，问题在于该组件最终将与多个apps共享，但将具有不同的<menu/>，并且布局不具有slots
我不确定为什么vue重新渲染了整个组件，即使它在所有页面之间共享并且在每个页面上都是相同的。
我在这里想念什么？
如果这是我期望的行为，我的问题就变成了，如何在不调整props且不不断重新加载的情况下，创建一个共享组件，该组件的行为就像我包含在多个页面中的布局？>
+ ====更新==== +
我一直在努力使嵌套路由起作用，因为我相信这就是我追求的目标。但是，nuxt无法正确生成它们
根据文档（``）我需要将我的结构更改为
pages _entity messaging settings index.vue msg index.vue messaging.vue(wrong - changed back to index.vue) -> within here add the <nuxt-child> component messaging.vue(need to move to _entity folder to create children)
nuxt应创建子组件。但是，它仍在继续创建完整路线。我正在使用nuxt-i18n会导致问题吗？
路线
...
{
path: "/:entity/messaging/messaging",
component: _8a865700,
name: "entity-messaging-messaging___en"
}, {
path: "/:entity/messaging/:msg?",
component: _1ef926cc,
name: "entity-messaging-msg___en"
}, {
path: "/:entity/messaging/settings",
component: _7b358e6a,
name: "entity-messaging-settings___en"
}
我创建了一个全局组件，可以在多条路线中共享。我已简化了以下组件以进行演示。 #name area-wrapper