英文:
why does the default.vue in layouts of nuxt3 not work
问题
<template>
<div>
<p>123</p>
<slot/>
</div>
</template>
<style scoped>
.router-link-exact-active{
color:red;
}
</style>
英文:
<template>
<div>
<p>123</p>
<slot/>
</div>
</template>
<style scoped>
.router-link-exact-active{
color:red;
}
</style>
I have checked the path of layouts and pages, but the default.vue doesn't apply it's template to the pages
答案1
得分: 0
通过查看您的代码，不清楚您想要表达什么。但是，如果我猜得对的话，您想问为什么您的 Nuxt3 应用程序没有使用默认布局。
以下是一些解决方案：
如果您正在使用 app.vue，您需要将您的
<NuxtLayout name="default">
<NuxtPage />
</NuxtLayout>
<!-- 您还可以传递一个动态名称 -->
<NuxtLayout :name="name">
<NuxtPage />
</NuxtLayout>
如果您没有使用 app.vue，您需要在您的页面中像这样使用 definePageMeta() 宏：
<script setup>
definePageMeta({
layout: 'default'
})
</script>
英文:
By looking at your code, it's unclear what you're trying to say. However, if I guess correctly, you want to ask why your Nuxt3 app is not using the default layout.
Here are a few solutions:
If you are using app.vue, you need to wrap your <NuxtPage /> component in the <NuxtLayout /> component like this:
<NuxtLayout name="default">
<NuxtPage />
</NuxtLayout>
<!-- You can also pass a dynamic name -->
<NuxtLayout :name="name">
<NuxtPage />
</NuxtLayout>
If you are not using app.vue, you need to use the definePageMeta() macro within your pages like this:
<script setup>
definePageMeta({
layout: 'default'
})
</script>
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论