Nuxt.js <nuxt> 組件

<nuxt> 組件

該組件只適用于在布局中顯示頁面組件（即非布局內(nèi)容）。

例子 (layouts/default.vue)：

<template>
  <div>
    <div>頁頭</div>
    <nuxt/>
    <div>頁腳</div>
  </div>
</template>

可以看下這個實際的布局示例。

Props:

• nuxtChildKey: string此prop將設(shè)置為<router-view />，可用于在動態(tài)頁面和不同路由內(nèi)進行過渡。默認: $route.path

有三種方式可以處理 <router-view /> 內(nèi)部屬性的 key。

1. nuxtChildKey 屬性：

<template>
   <div>
     <nuxt :nuxt-child-key="someKey"/>
   </div>
</template>

1. 頁面組件中的key選項：string 或 function

export default {
  key (route) {
    return route.fullPath
  }
}

1. 頁面組件中的watchQuery選項：boolean 或 string []

watchQuery選項中指定的查詢會被用于構(gòu)建key。如果watchQuery為true，則默認使用fullPath。

• name: string (Nuxt v2.4.0 新增)此 prop 將提供給<router-view />使用，用于渲染命名視圖。默認: default

查看例子請點擊： 命名視圖例子.