Vue.js 将页面部分添加到nuxt中的主布局中

我有一个nuxt布局，如下所示

在页面中设置内容

但是现在我需要填写write

set content in page

部分，以便从页面组件导入

我的意思是，我喜欢将不同页面中的自定义组件导入此部分

---

有没有可能或者有什么方法可以做到这一点？

您可以使用存储数据来做到这一点

在您的页面中：

this.$store.dispatch('changeLayoutComponent', 'componentName')

在nuxt布局中，使用这些数据在不同的页面中显示不同的组件，您可以使用动态组件来实现这一点

=>在您的布局中

<template>
    ...
    <component v-bind:is="currentTabComponent"></component>
    ...
</template>
<script>
  export default {
     data() {
       return {
          currentTabComponent: this.$store.state.componentName
       }
     },
     //watch store for changes
     watch: {
       "$store.state.componentName": function() {
            this.currentTabComponent= this.$store.state.componentName
       }
     }
  }
</script>

...
...
导出默认值{
数据（）{
返回{
currentTabComponent:this.$store.state.componentName
}
},
//留意商店的变化
观察：{
“$store.state.componentName”：函数（）{
this.currentTabComponent=this.$store.state.componentName
}
}
}