<DevOnly>

使用 <DevOnly> 组件仅在开发环境中渲染组件。

Maschinelle Übersetzung ·0 % geprüft

Nuxt 提供 <DevOnly> 组件,用于仅在开发期间渲染组件。

该内容不会包含在生产构建中。

app/pages/example.vue
<template>
  <div>
    <Sidebar />
    <DevOnly>
      <!-- Diese Komponente wird nur während der Entwicklung gerendert -->
      <LazyDebugBar />

      <!-- falls du in der Produktion einmal einen Ersatz benötigst -->
      <!-- teste diesen unbedingt mit `nuxt preview` -->
      <template #fallback>
        <div><!-- leeres div für flex.justify-between --></div>
      </template>
    </DevOnly>
  </div>
</template>

插槽

  • #fallback:如果你需要在生产环境中提供替代内容。
<template>
  <div>
    <Sidebar />
    <DevOnly>
      <!-- Diese Komponente wird nur während der Entwicklung gerendert -->
      <LazyDebugBar />
      <!-- teste diesen unbedingt mit `nuxt preview` -->
      <template #fallback>
        <div><!-- leeres div für flex.justify-between --></div>
      </template>
    </DevOnly>
  </div>
</template>