嵌套 useFetch 导致 Nuxt 3 中的 Hydration 节点不匹配
在 Nuxt 3 页面内,我通过从 pinia 存储调用操作来获取帖子数据: {{ 发布数据 }} {{ 帖子内容... 在 Nuxt 3 页面内,我通过从 pinia 商店调用操作来获取帖子数据: <template> <div v-if="postData && postContent"> {{ postData }} {{ postContent }} </div> </template> <script setup> const config = useRuntimeConfig() const route = useRoute() const slug = route.params.slug const url = config.public.wpApiUrl const contentStore = useContentStore() await contentStore.fetchPostData({ url, slug }) const postData = contentStore.postData const postContent = contentStore.postContent </script> 那是我的商店: import { defineStore } from 'pinia' export const useContentStore = defineStore('content',{ state: () => ({ postData: null, postContent: null }), actions: { async fetchPostData({ url, slug }) { try { const { data: postData, error } = await useFetch(`${url}/wp/v2/posts`, { query: { slug: slug }, transform(data) { return data.map((post) => ({ id: post.id, title: post.title.rendered, content: post.content.rendered, excerpt: post.excerpt.rendered, date: post.date, slug: post.slug, })); } }) this.postData = postData.value; if (postData && postData.value && postData.value.length && postData.value[0].id) { const {data: postContent} = await useFetch(`${url}/rl/v1/get?id=${postData.value[0].id}`, { method: 'POST', }); this.postContent = postContent.value; } } catch (error) { console.error('Error fetching post data:', error) } } } }); 浏览器中的输出正常,但我在浏览器控制台中收到以下错误: entry.js:54 [Vue warn]: Hydration node mismatch: - rendered on server: <!----> - expected on client: div at <[slug] onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< undefined > > at <Anonymous key="/news/hello-world()" vnode= {__v_isVNode: true, __v_skip: true, type: {…}, props: {…}, key: null, …} route= {fullPath: '/news/hello-world', hash: '', query: {…}, name: 'news-slug', path: '/news/hello-world', …} ... > at <RouterView name=undefined route=undefined > at <NuxtPage> at <Default ref=Ref< undefined > > at <LayoutLoader key="default" layoutProps= {ref: RefImpl} name="default" > at <NuxtLayoutProvider layoutProps= {ref: RefImpl} key="default" name="default" ... > at <NuxtLayout> at <App key=3 > at <NuxtRoot> 如何解决这个问题? 我尝试在 onMounted 中获取帖子数据,但在这种情况下 postData 和 postContent 保持为空 onMounted(async () => { await contentStore.fetchPostData({ url, slug }) }) 您可以使用 ClientOnly 组件来消除该警告。请参阅文档了解更多信息。 该组件仅在客户端渲染其插槽。
发布API 导出 const resendInvitation = async (userName) => { wait API.post( 'delta-api',user-mgmt/users/${userName}/resendInvitation, {} ); }; const handleResendInvitation = async () =>...
我的 VS CODE 屏幕截图 代码是正确的,没有错误。我已经安装了最新版本的 Node js,并且没有更新显示 Node Index.js 仍然没有在术语中运行...
我阅读了一些 Docker 和 Node.js 最佳实践文章,例如https://github.com/nodejs/docker-node/blob/main/docs/BestPractices.md 或使用
onDidReceiveBackgroundNotificationResponse 在颤振本地通知中未触发
这是我的void main函数: Future RemoteMessageHandler(RemoteMessage 消息) async {} 无效 main() 异步 { WidgetsFlutterBinding.ensureInitialized(); 等待 Firebase.initializeA...
我有这个curl命令,我需要在node js中编写: 卷曲-X POST \ https://image.adobe.io/pie/psdService/renditionCreate \ -H“授权:不记名$令牌”\ -H“x-api-...
Node Sass 版本 9.0.0 与 ^4.0.0 不兼容
我的应用程序中没有安装node-sass或sass包。但我一直收到这个错误 ./src/scss/styles.scss 中的错误(./node_modules/@angular-devkit/build-angular/src/angular-cli-files/plu...
当我尝试在 Visual Code Studio 上运行“ts-node index.ts”等代码时,它显示错误消息
/usr/local/lib/node_modules/ts-node/src/index.ts:857 const DiagnosticText = formatDiagnostics(诊断,diagnosticsHost); 类型错误:formatDiagnostics 不是函数 在 createTSError (/usr/loc...
信息:node_modules/node-expose-sspi/dist/sso/client.d.ts:3:8 - 错误 TS1192:模块“http”没有默认导出。 在我安装了node-expose-sspi之后,然后编译了Angular项目(v...
存在于松果.ts 中 从 '@pinecone-database/pinecone' 导入 { PineconeClient } 导出 const getPineconeClient = async () => { const client = new PineconeClient() 等待客户。
Node Express.js 应用程序在本地运行良好,但在 Docker 中显示“无法获取/”
我在 Node 应用程序中定义了一个 Express.js 服务器,如下所示: const express = require('express') const SignRequest = require('./SignRequest/lambda/index.js') const VerifyResponse = require('./
使用 Node Express 托管网站无法与 Windows 任务计划程序一起使用
我编写了一个简单的网站,并使用 Node Express 托管它。 const express = require('express') 常量应用程序 = Express() app.use(express.static('./')) app.listen(7100, () => { console.log('开始'...
所以我使用此代码获得了交互嵌入: client.on('interactionCreate', async (interaction) => { if (!interaction.isButton()) 返回; const raidembed = 交互.消息.嵌入 ...
node/nodemon 中是否有对 typescript 的源映射支持?
我有一个用 typescript@2 编写的节点项目。 我的 tsconfig 将 sourceMap 设置为 true 并生成 *.map.js 文件。当我通过 node 或 nodemon 执行转译的 *.js JavaScript 文件时,我...
我有一系列这样的测试用例: it('应该禁用渲染按钮', async () => { 使成为(...); const 按钮 = screen.getByRole("按钮"); 期待(按钮).toBeDi...
在 Caml Async 中等待 Writer.write 完成
我有以下简单的 OCaml 异步作业,该作业应该写入文件并终止进程。 Unix.openfile "foobar" ~mode:[`Creat;`Rdwr] >>= 有趣的 fd -> 让 wr = Writer.cre...
我正在尝试使用 ConfigModule 加载配置,如下所示 ConfigModule.forRoot({ 忽略EnvFile:真, 是全局的:正确的, 加载:[async () =>等待 fetchConfig(new
为什么 File.ReadAllLinesAsync() 会阻塞 UI 线程?
这是我的代码。读取文件行的 WPF 按钮的事件处理程序: private async void Button_OnClick(对象发送者, RoutedEventArgs e) { Button.Content = "正在加载..."; 变种
在使用 Express 的 Node app.js 之后,控制台未显示“服务器启动”
当我在终端上插入 Node app.js 时,我没有在控制台上收到启动服务器:3001 消息。 我的 app.js 文件内容: var createError = require('http-errors'); var express = require('express'); 变量路径 =
在 Docker 中的 Ubuntu 上安装最新版本 Node (v20) 的说明不起作用?
我只是按照说明在 Ubuntu 上的 docker 中安装了最新版本的 Node (v20),在我的 Dockerfile 中包含以下内容: 来自 --platform=linux/amd64 ubuntu:22.04 运行 apt-get update 运行 apt-get...
为什么ElasticSearch将主分片和副本分片放在同一主机上?
这是添加到现有集群测试中的新主机,触发了重新平衡过程。 两个节点node-5、node-6位于新物理主机中。 对于每个分片,只有一个主分片...
为什么ElasticSearch将主分片和副本分片放在同一主机上?
这是添加到现有集群测试中的新主机,触发了重新平衡过程。 两个节点node-5、node-6位于新主机中。 对于每个分片,只有一个主分片和一个
请帮助我。这是我下面关于discord.js 聊天机器人的代码 const fetch = require("node-fetch"); const {ChannelType} = require("discord.js"); client.on('messageCreate...
谁能告诉我可能是什么问题? 警告应用程序实例 谁能告诉我可能是什么问题? 警告应用程序实例 wait_for=> 连接 关闭时间过长并被终止。 我的阿斯吉 "^subscription", channels_jwt_middleware(MyConsumer.as_asgi(schema=schema)) ) application = ProtocolTypeRouter({ "http": django_asgi_app, "websocket": QueryAuthMiddleware( URLRouter([ subscription_url, ]) ), })``` my custom MyConsumer ```class MyConsumer(GraphQLWSConsumer): def __init__(self, *args, **kwargs): super().__init__(*args, **kwargs) self.profile_id = None async def __call__(self, scope, receive, send): user = scope.get("user", None) time_zone = await get_current_timezone(user) self.profile_id = scope.get("active_profile_id", None) self.timezone = time_zone if time_zone else settings.TIME_ZONE await super().__call__(scope, receive, send) async def connect(self): await super().connect() await change_status(True, self.profile_id) async def disconnect(self, close_code, *args, **kwargs): await super().disconnect(close_code) await change_status(False, self.profile_id)``` 解决我的问题 daphne -b 0.0.0.0 -p $SERVER_PORT --application-close-timeout 60 --proxy-headers server.asgi:application
使用 async/await 获取 firebase.auth().currentUser
我成功使用 onAuthStateChange 观察者检查用户的身份验证状态并将用户重定向到仪表板页面(react-native 项目)。然而,在仪表板上我已经想展示一些......
假设我们有要转换的 XML: 测试 / 假设我们有要转换的 XML: <?xml version="1.0" encoding="UTF-8"?> <node> <field1>test</field1> <field2>/</field2> <field3>test2</field3> <field4>/<field4> </node> 我想使用 XSLT 1.0 对其进行转换,以便复制整个结构和所有值,除了具有值“/”的元素。 到目前为止,我已经找到了这个,我认为这离我需要的并不遥远,但它还没有工作。 <xsl:transform xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0"> <xsl:strip-space elements="*"/> <xsl:output indent="yes"/> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply-templates select="@*|node()"/> </xsl:copy> </xsl:template> <xsl:template match="//text()='/'" /> </xsl:transform> 所以我期望的输出是这样的: <?xml version="1.0" encoding="UTF-8"?> <node> <field1>test</field1> <field3>test2</field3> </node> 尝试此操作时,我收到未指定的错误(因为我正在使用免费的在线工具进行转换)。 //text()='/' 不是有效的位置路径。 在任何情况下,您想要删除元素,而不是文本节点 - 所以您应该使用类似的东西: <xsl:template match="*[.='/']" />
我运行了 nvm ls-remote ,列表的末尾如下所示: v14.17.6(LTS:镄) v14.18.0(LTS:镄) v14.18.1(LTS:镄) v14.18.2(LTS:镄) ...
我需要帮助更新 Mac 上的 Node 版本才能使用 Next JS,即使已安装,我仍然收到错误消息
我正在创建一个新的 NextJS 应用程序,它说它需要较新版本的 Node >= v18.17.0 才能与 Next JS 一起使用。我一直在尝试更新,但它说活动节点版本是
自动完成功能不适用于 VSCode 中的 TypeScript + Node
所以如果我编写纯 JS (.js),它的工作方式如下: 但对于 TypeScript (.ts) 它不起作用:
我正在从网络读取数据,我想在收到数据时将其写入文件。写入是并发且非顺序的(想想 P2P 文件共享)。在 C 中,我会得到一个文件描述符......
所以我使用express-async-handler来处理异步函数,它应该在抛出错误后自动添加next(),但由于某种原因它看起来没有。 这是我的功能
用于等待两个 async let 返回类型 void 的简洁语法
Swift 中的两个异步函数应该同时启动,然后在某个时刻等待。我已经找到了一个解决方案,但我对语法并不是 100% 满意。我想写
我正在安装这些 npm 软件包: npm 我表达 body-parser bcrypt cors dotenv gridfs-stream multer multer-gridfs-storage 头盔 morgan jsonwebtoken mongoose 但是,当...
如何在React Native Vision Camera中更改照片的宽度和高度或裁剪它?
我只是想获得一个方形图像并尽可能减小图像的尺寸,同时保持图像文本清晰。 这是我的尝试,但它不起作用。 const capturePhoto = async () =>...
Vue3 的 onMounted 钩子中带有异步的 Pinia 方法未同步执行 - 我错过了什么?
我在 onMounted 钩子中使用了 async 和 pinia 方法,不会同步执行代码。 当我尝试查看 {{ store }} 时,它不显示任何内容。请让我知道出了什么问题。比...
在 ec2 中安装节点,Amazon Linux2 错误 glibc >= 2.28
尝试在以下位置安装 npm 和 node: 猫 /etc/os-release 名称=“亚马逊Linux” 版本=“2” ID=“amzn” ID_LIKE="centos rhel fedora" 版本_ID=“2” 漂亮...
为什么我有很多对 API 的请求,需要在 next.js 13v 的服务器端获取数据
我使用 Next.js 13v 在服务器端获取数据。 我的组件 const 页脚 = async () => { // 获取数据 const allCategories = (await getAllCategories({})).data; 返回 我使用 Next.js 13v 在服务器端获取数据。 我的组件 const Footer = async () => { // Get data const allCategories = (await getAllCategories({})).data; return <footer className={styles.footer}></footer>; }; 我的功能 export const getAllCategories = async ( params: IGetAllCategoriesRequest, ): Promise<AxiosResponse<IGetAllCategoriesResponse>> => { const url = 'static-pages/category/public'; const response = await axiosInstance.get<IGetAllCategoriesResponse>( url, { params: params, }, ); return response; }; 如果请求成功,我有一个请求 但是如果出现错误,我有很多请求,然后重定向到错误页面 本机获取具有相同的行为 那么为什么我在 next.js 13v 中对 API 有很多请求并在服务器端获取数据? 可能和开发模式有关。我发现这篇文章可能与此行为有关:https://dev.to/noclat/fixing-too-many-connections-errors-with-database-clients-stacking-in-dev-mode-with-next -js-3kpm
获取“解析期间的 Http 失败” - 尝试模仿缓慢的 API 以显示 Async-Await 的重要性
我使用虚拟 API 来演示 Asyn-await 在处理延迟的服务器响应时的重要性。简单的事情是,如果我对这个 URL (https://hub.dummyapis.com/delay?seconds=3) 进行 get 调用,我...
所以客户端javascript中的异步编程是setTimeOut在浏览器API中运行,因此它不会阻塞javascript单线程。由于我们在 Node 中没有浏览器 API,谁...
我很确定我的ID和秘密是正确的。 这是真正的链接:(https://sandbox.mngkargo.com.tr/en/node/266) 发布 https://testapi.mngkargo.com.tr/mngapi/api/token 标题: 内容-
如何使用 twitch 机器人让某人超时(client.timeout 和 client.say(channel, `/timeout @${tags.username} 不起作用)?
我无法使用 Twitch 聊天机器人禁止或超时在 js 中编写某些单词的用户。但是,我可以使用机器人发送消息。 我的代码: client.on('消息', async (频道, 标签, 消息, self) =>...
我定义了一个 Node 类,其值类型带有模板 模板 类节点{ T 值; 民众: 节点 (T & v) : val (v) {} ... 无效打印(){cout<< v <<...
Typescript 无法与 tsconfig.json 一起使用
在项目中使用 tsconfig 运行 tsc --watch 时,出现以下错误。 它需要 Node js 中的 React 和 Redux 类型。 错误 TS2688:找不到“abstract-leveldow...”的类型定义文件...
我正在使用passport-google-oauth 运行node.js。从我的 package.json 中: "passport-google-oauth": "~1.0.0", 我遵循了本教程:https://scotch.io/tutorials/easy-node-authentication-google 在...
我已将 auth0 集成到 remix.run 应用程序中,现在尝试保存登录时发出的访问令牌: 从“@remix-run/node”导入{createCookieSessionStorage}; 导入 { getOrThrow ...
我正在尝试运行我的内置生产版本代码。使用 Node 20.10、typescript 5 并且无法运行该构建版本。 下面是我的 package.json、tsconfig.json 文件。 { "name": "节点-
我已经在nodejs中设置了内容安全策略(CSP),并且它正在应用于node。但是,对于根 html 页面,未应用 CSP。如何借助nodejs应用在html上......
当其中一个属性是通过 API 调用获得的另外两个属性计算出来时,如何填充模型属性?
[已解决] 我没有将反向地理代码视为异步函数,从而导致计时问题和数据无法正确填充。使用 async wait 解决了这个问题。 解决方案: func getCurrentWeat...
我正在尝试从此存储库节点-mecab 运行此代码 用于分析日语文本 从“@enjoyjs/node-mecab”导入{分析}; const result =等待分析(“こんにちは世界”); 康索...
托管在 Azure Artifact 上的 NodeRed 目录
我一直在尝试使用 Azure DevOps 实例上托管的 npm feed 将自定义目录添加到我的 Node-RED 安装中。我到处寻找文档,包括这个,我遇到了