<DevOnly>
使用 <DevOnly> 组件仅在开发环境中渲染组件。
Nuxt 提供了 <DevOnly>
组件,用于仅在开发环境中渲染组件。
内容不会包含在生产构建中。
pages/example.vue
<template>
<div>
<Sidebar />
<DevOnly>
<!-- 该组件仅在开发环境中渲染 -->
<LazyDebugBar />
<!-- 如果你需要在生产环境中有替代内容 -->
<!-- 请务必使用 `nuxt preview` 来测试这些内容 -->
<template #fallback>
<div><!-- 用于 flex.justify-between 的空 div --></div>
</template>
</DevOnly>
</div>
</template>
插槽
#fallback
:如果你需要在生产环境中有替代内容。
<template>
<div>
<Sidebar />
<DevOnly>
<!-- 该组件仅在开发环境中渲染 -->
<LazyDebugBar />
<!-- 请务必使用 `nuxt preview` 来测试这些内容 -->
<template #fallback>
<div><!-- 用于 flex.justify-between 的空 div --></div>
</template>
</DevOnly>
</div>
</template>