nuxt.js 相关问题

无法更改默认的 nuxt 图标

我是 nuxt 新手，正在尝试更改项目中的默认图标。 我更改了静态文件夹中的 favicon.png 和 favicon.ico。 => 没用。 更改了我的文件中的 favicon.png 和 favicon.ico...

我想在 nuxt.js 中使用 410 statusCode 进行重定向

我的网站上有一系列活动，我希望活动结束后一年过去一次，当点击它时，它会重定向到带有 410 代码的错误布局。

缩小窗口时导航消失

缩小窗口时导航消失。 下面是缩小窗口之前的图像 下面是窗口缩小时的图像 下面是default.vue中的代码 ... 缩小窗口时导航消失。 下面是缩小窗口之前的图像 下图是窗口缩小时的图像 下面是default.vue中的代码 <template> <v-app> <Header /> <div class="d-flex flex-0-1-100"> <SideMenu /> <v-main class="pl-0"> <v-container> <slot /> <NavigationLink /> </v-container> </v-main> <TableofContents /> </div> <Footer /> </v-app> </template> 下面是 SideMenu.vue 的代码 <script setup lang="ts"> import { computed } from 'vue'; import { useLayout } from 'vuetify'; const { mainStyles } = useLayout(); const marginTop = mainStyles.value['--v-layout-top']; const maxHeight = computed( () => `calc(100vh - ${mainStyles.value['--v-layout-top']})` ); const minWidth = '250px'; const route = useRoute(); const { navigation } = useContent(); const { baseUrl } = useRuntimeConfig().public; const matchedNavObject = navigation.value.find( (navObject: { _path: string }) => navObject._path === `/${route.params.slug[0]}` ); const isPathMatched = (path: string, itemPath: string): boolean => { // パスの末尾を除いて比較するため、route.pathから末尾のスラッシュを取り除く const normalizedPath = path.endsWith('/') ? path.slice(0, -1) : path; return normalizedPath.includes(itemPath); }; const panel = matchedNavObject.children.findIndex((item: { _path: string }) => isPathMatched(route.path, item._path) ); </script> <template> <client-only> <v-navigation-drawer border="none" class="position-sticky" :style="{ maxHeight, minWidth, marginTop }" style="height: fit-content" width="250" > <v-expansion-panels :modelValue="panel" :multiple="true"> <v-expansion-panel v-for="(item, i) in matchedNavObject.children" :key="i" > <v-expansion-panel-title>{{ item.title }}</v-expansion-panel-title> <v-expansion-panel-text v-for="(navItem, j) in item.children" :key="j" > <nuxt-link :to="`${baseUrl}${navItem._path}`" class="text-decoration-none" :class="{ active: `${navItem._path}/` === route.path, }" >{{ navItem.title }}</nuxt-link > </v-expansion-panel-text> </v-expansion-panel> </v-expansion-panels> </v-navigation-drawer> </client-only> </template> <style scoped lang="scss"> a { color: $color-gray-100; } .active { background-color: $color-blue; color: $color-white; font-weight: bold; border-radius: 4px; padding: 4px 8px; } </style> 如何防止缩小窗口时导航内容消失？ 如果有人能给我一些建议，我将不胜感激 我尝试过以下方法 从default.vue的标签中删除后，导航不再消失，但它变得聚焦了 <v-main class="pl-0"> <slot /> <NavigationLink /> </v-main> 使用 permanent 道具保持导航打开： <v-navigation-drawer permanent ...

Nuxt - 仅在服务器端渲染 HTML

我的页面有一个标题，我从服务器中的文件中获取该标题： 数据（） { 返回 { headerHTML: '' }; }, 拿来（） { this.headerHTML = fs.readFileSync('./header.html', 'utf8'); } 我渲染标题

如何在 Nuxt 3 中访问中间件内的 useState？

我正在使用 Nuxt 3 和 useState 来存储用户是否登录。然后在中间件中，如果用户未登录，我想阻止导航。 可组合项/states.ts 导出 const useAuth =...

如何在chart.js中传递图表数据而不会出现类型错误

我正在创建一个带有图表的应用程序，目前我正在尝试将商店中的信息插入其中。但是，我收到错误。当我尝试通过时会发生此错误...

使用 nuxtjs 内容显示字符串中的 markdown 内容

假设，我的数据库中有一个包含 markdown 内容的字符串，从数据库中获取该字符串后，如何在不使用 md 扩展的情况下使用 nuxtjs 内容模块显示它？ 可以

Nuxt、VueJS 这必须在设置函数中调用

我有一个项目。目前可以在某个网站上找到。我需要实施一些改变。当我从 gitlab 下载一个项目并运行它时，它会抛出一个错误：This Must be call inside a...

如何在Nuxt中设置Persistence Firebase Modular SDK V9？

我正在使用 Firebase 对 Nuxt 中的用户进行身份验证，我想确保用户登录 Firebase 并通过身份验证后，即使我启动了新选项卡，他们仍然会登录。

如何在nuxtjs中集成bootstrap 5？

首先，我尝试集成 bootstrap-vue，但它支持 bootstrap 4，甚至更糟糕的 vue2。 因此，我尝试按照以下步骤集成 bootstrap 5，而不进行任何更改： 我安装了引导程序

如何解决“错误：错误：0308010C：数字信封例程::不支持”Nodejs 18 错误[重复]

我的 NuxtJS 应用程序需要帮助。 最近，在我离开应用程序一段时间（2 个月）而没有更新后，应用程序中出现了 ESLint 冲突。所以当我开始研究它之后，它提出了一个挑战......

如何知道nuxt 3中完成的所有请求

我想制作自定义加载页面， 加载所有请求或静态数据（例如（静态图像 - 某些库））后，我想隐藏加载页面。 那么我如何检查请求和静态数据是否已加载...

使用 Nuxt Content 在 Nuxt 3 中查询 JSON 数组

如何在 Nuxt 3 和 Nuxt Content 中查询 JSON 数组中的单个元素？ ├── @nuxt/[email protected] └── [email protected] 内容/people.json [ { "姓名": "姓名1", “身份证&...

使用Nuxt的动态元头标题缓存问题

我有一个可组合项，用于获取并存储全局变量： // useRandomEmoji.ts 导出默认异步函数() { const { 数据、刷新、执行 } = 等待 useAsyncData( '随机表情符号', ...

<NuxtLink> Nuxt 3 中仅在刷新后显示页面内容

我正在尝试使用 在 Nuxt 3 中进行重定向。 但是，URL 更改后我的页面将不会显示。 这意味着，单击链接后，URL 会更改为 to=&qu... 中所述的内容

动态元头标题缓存问题，当通过浏览器后退和前进按钮导航时，使用 Nuxt、useHead、useAsyncData

我有一个可组合项，用于获取和存储全局变量 // useRandomEmoji.ts 导出默认异步函数() { const { 数据、刷新、执行 } = 等待 useAsyncData( '随机表情符号', ()...

IOS 在 nuxt.js 中点击弹出菜单出现问题

网站上有菜单。对于移动设备，它具有完整的宽度和高度。在 Android 设备上，它工作得很好，但是当在 iPhone (safari) 上使用菜单时，菜单开始表现得很奇怪......

如何在 Nuxt 3 应用程序中添加页面加载器

我正在使用 Nuxt 3 构建一个应用程序，我想添加一个页面加载器直到网站加载。

在nuxt-link内触发另一个点击事件

标题文字 产品说明 加入购物车 <div> <nuxt-link to="/home"> <h1>Title text</h1> <p>Product description</p> <p @click.stop="addCart()">Add to cart</p> </nuxt-link> </div> 我无法点击我的 addCart 功能。如果我点击它只是重定向到主页。 这应该可以解决您的问题： @click.prevent="addCart()" 我用 vue 中的 prevent 事件修饰符解决了这个问题 <div> <nuxt-link to="/home"> <h1>Title text</h1> <p>Product description</p> <p @click.prevent="addCart()">Add to cart</p> </nuxt-link> </div>

Nuxt useFetch 在页面重新加载时未获取 cookie

我尝试使用 useFetch 从我的 Express 服务器调用 api，它可以工作，但如果我尝试重新加载页面，则 api 不会被调用。我的猜测是 httponly cookie 没有附加到请求中......