当前位置: 首页 > 知识库问答 >
问题:

react.js - 使用 nextjs 时有一个 react 的警告?

晏望
2024-03-27

使用 nextjs 时有一个 react 的警告

Warning: React does not recognize the `originalProps` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `originalprops` instead. If you accidentally passed it from a parent component, remove it from the DOM element.    at button    at eval (webpack-internal:///(ssr)/./node_modules/@nextui-org/popover/dist/chunk-K4VREUER.mjs:23:115)    at eval (webpack-internal:///(ssr)/./node_modules/@nextui-org/dropdown/dist/chunk-63RZRIL7.mjs:15:108)    at eval (webpack-internal:///(ssr)/./node_modules/@nextui-org/popover/dist/chunk-I7AEEVL3.mjs:21:13)    at Dropdown (webpack-internal:///(ssr)/./node_modules/@nextui-org/dropdown/dist/chunk-FHP3QEBP.mjs:17:13)    at li    at eval (webpack-internal:///(ssr)/./node_modules/@nextui-org/navbar/dist/chunk-MG5LCNUN.mjs:19:13)    at ul    at eval (webpack-internal:///(ssr)/./node_modules/@nextui-org/navbar/dist/chunk-PSG7VTZC.mjs:18:13)    at header    at nav    at eval (webpack-internal:///(ssr)/./node_modules/@nextui-org/navbar/dist/chunk-CMNN5TJ7.mjs:25:13)    at div    at body    at html    at RootLayout (webpack-internal:///(ssr)/./app/layout.tsx:50:23)    at Lazy    at RedirectErrorBoundary (webpack-internal:///(ssr)/./node_modules/next/dist/client/components/redirect-boundary.js:71:9)    at RedirectBoundary (webpack-internal:///(ssr)/./node_modules/next/dist/client/components/redirect-boundary.js:79:11)    at ReactDevOverlay (webpack-internal:///(ssr)/./node_modules/next/dist/client/components/react-dev-overlay/internal/ReactDevOverlay.js:66:9)    at HotReload (webpack-internal:///(ssr)/./node_modules/next/dist/client/components/react-dev-overlay/hot-reloader-client.js:296:11)    at Router (webpack-internal:///(ssr)/./node_modules/next/dist/client/components/app-router.js:147:11)    at ErrorBoundaryHandler (webpack-internal:///(ssr)/./node_modules/next/dist/client/components/error-boundary.js:99:9)    at ErrorBoundary (webpack-internal:///(ssr)/./node_modules/next/dist/client/components/error-boundary.js:128:11)    at AppRouter (webpack-internal:///(ssr)/./node_modules/next/dist/client/components/app-router.js:415:13)    at Lazy    at Lazy    at /Users/mac/vscode/xx-pro/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:35:379796    at /Users/mac/vscode/xx-pro/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:35:379796    at ServerInsertedHTMLProvider (/Users/mac/vscode/xx-pro/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:38:17279)

首先,针对这种报错信息,我猜测是组件的 prop估计接受了父组件传递下来的参数作为 prop,但是名称又不符合规范
但是,我全局搜索了originalProps这个关键词,发现没有找到。 另外我想知道怎么调试,怎么知道他发生在哪个组件的哪一行。似乎 nextjs没有 java 代码那么容易的定位

共有1个答案

艾才良
2024-03-27

似乎是nextui的bug,官方正在修复中

 类似资料:
  • 移除任何具有匹配意图的警报。任何类型的警报,其意图与此匹配(由filterEquals(Intent)定义),都将被取消。 由于此应用程序设计为具有多个一次性警报,我想知道我的假设是,由于这些警报都来自由相同方法创建的相同基本意图,取消一个警报是否会取消所有警报。如果是的话,我该如何处理这件事呢?

  • 问题内容: 两者都有路由,链接等。何时使用一个或另一个?我真的很困惑在哪里使用每个。服务器端?客户端? https://reacttraining.com/react-router/ 在某些示例中,您需要传递历史记录,而在其他示例中则不需要。该怎么办? 与 何时使用一个或另一个非常令人困惑,任何帮助都值得赞赏。 问题答案: react-router 包含 react-router-dom 和 re

  • React中的useCallback 下面的代码中Com是父组件,Button是子组件,子组件接收父组件的count2和setCount2,子组件中使用了memo(Button)导出 子组件Button 在上面的代码中,如果点击count1++的按钮(不使用useCallback),父组件会重新渲染,但是子组件也会刷新,然而子组件中的count2依赖没有变化,所以只能是handleClick2函数

  • 我已经创建了一个高阶组件,它应该为我的组件添加一些额外的功能。然而,当我在这个组件中使用反应钩子时,我会得到以下eslint警告。 不能在回调内调用React钩子“React.useffect”。必须在React函数组件或自定义React钩子函数中调用React钩子。(吊钩/吊钩规则) 为什么我会收到这个警告?在HoC中使用钩子被认为是不好的做法吗? 最简单的例子: Codesandbox:htt

  • 我使用firebase作为数据库,使用Ionic React作为移动应用程序。我已经将firebase数据转换为数组,但当我想映射值时。它告诉我它应该有一个唯一的键,但我已经在元素的返回函数中放置了一个唯一的键。有人能告诉我我做错了什么吗?谢谢 下面是我将对象转换为数组的代码 作为回报 我得到的是