⚛️ React Errors

32 error notes

reactbeginner

Sửa lỗi 'TypeError: data.map is not a function' trong React

TypeError: data.map is not a function
reactjavascriptfrontenddebugging
reactintermediate

Sửa lỗi cảnh báo 'React has detected a change in the order of Hooks'

Warning: React has detected a change in the order of Hooks called by ComponentName. This will lead to bugs and errors if not fixed. For more information, read the Rules of Hooks: https://reactjs.org/link/rules-of-hooks
reacthooksrules-of-hooksgỡ lỗi
reactintermediate

Sửa lỗi 'Prop className did not match' với styled-components trong React SSR

Warning: Prop `className` did not match. Server: "sc-bdVTJa" Client: "sc-fzoLsD"
reactstyled-componentsssrhydration
reactbeginner

Sửa lỗi 'Element type is invalid: expected a string but got: undefined' trong React

React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.
reactjavascriptgỡ lỗifrontend
reactintermediate

Fix ChunkLoadError: Loading chunk failed trong React Production Build

ChunkLoadError: Loading chunk 3 failed. (error: https://example.com/static/js/3.chunk.js)
webpackcode-splittingreact-lazyproduction
reactintermediate

Sửa lỗi 'Cannot update a component while rendering a different component' trong React

Warning: Cannot update a component (`App`) while rendering a different component (`Child`). To locate the bad setState() call inside `Child`, follow the stack trace as described in https://reactjs.org/link/setstate-in-render
reactsetStaterenderside-effect
reactintermediate

Sửa cảnh báo 'React Hook useEffect has a missing dependency' gây ra lỗi âm thầm

React Hook useEffect has a missing dependency: 'someVariable'. Either include it or remove the dependency array. react-hooks/exhaustive-deps
reactuseEffecteslinthooks
reactbeginner

Sửa cảnh báo 'Received true for a non-boolean attribute' khi truyền Boolean Props vào DOM Elements trong React

Warning: Received `true` for a non-boolean attribute `loading`. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `loading` instead. If you accidentally passed it from a parent component, remove it from the DOM element.
dompropsboolean-attributehtml
reactbeginner

Sửa lỗi 'Rendered more hooks than during the previous render' trong React

Error: Rendered more hooks than during the previous render.
reacthooksrules-of-hooksconditional-rendering
reactintermediate

Sửa lỗi 'Function components cannot be given refs' với React.forwardRef

Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?
reactforwardRefrefhooks
reactbeginner

Sửa lỗi 'Objects are not valid as a React child (found: object with keys {then})' — Render Promise trong JSX

Objects are not valid as a React child (found: object with keys {then}). If you meant to render a collection of children, use an array instead.
reactpromiseasyncjsx
reactbeginner

Sửa lỗi 'A component is changing an uncontrolled input to be controlled' trong React

Warning: A component is changing an uncontrolled input of type 'text' to be controlled. Input elements should not switch from uncontrolled to controlled (or vice versa).
reactformscontrolled-componentsstate
reactintermediate

Sửa lỗi 'useSearchParams() should be wrapped in a suspense boundary' trong Next.js

Error: useSearchParams() should be wrapped in a suspense boundary at page "/search". Read more: https://nextjs.org/docs/messages/missing-suspense-with-csr-bailout
reactnextjssuspenseusesearchparams
reactbeginner

Sửa lỗi: ReactDOM.render đã bị ngừng hỗ trợ trong React 18

Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until you switch to the new API, your app will behave as if it's running React 17.
reactreact18lap-trinh-webjavascript
reactbeginner

Sửa lỗi React validateDOMNesting: Ngưng đặt <div> bên trong <p>

Warning: validateDOMNesting(...): <div> cannot appear as a descendant of <p>. See ... > p > div.
reactdomhtmlnesting
reactintermediate

Khắc phục cảnh báo 'React does not recognize prop on a DOM element'

Warning: React does not recognize the `isActive` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `isactive` instead.
reactphát-triển-webstyled-componentsfrontend
reactintermediate

Cách Sửa Lỗi 'Blocked by CORS Policy' trong React

Access to fetch at 'http://api.example.com' from origin 'http://localhost:3000' has been blocked by CORS policy
reactcorsapifetch
reactintermediate

Sửa cảnh báo 'useLayoutEffect does nothing on the server' trong React SSR / Next.js

Warning: useLayoutEffect does nothing on the server because its effect cannot be encoded into the server renderer's output format. This will lead to a mismatch between the initial, non-hydrated UI and the intended UI.
reactnextjsssruseLayoutEffect
reactintermediate

Sửa lỗi 'Warning: An update to inside a test was not wrapped in act(...)' trong React Testing

Warning: An update to ForwardRef inside a test was not wrapped in act(...). When testing, code that causes React state updates should be wrapped into act(...).
reacttestingactreact-testing-library
reactintermediate

Cách khắc phục lỗi 'Module not found: Can't resolve' trong React

reactbeginner

Sửa lỗi 'TypeError: Cannot destructure property 'user' of 'useContext(...)' as it is undefined'

TypeError: Cannot destructure property 'user' of 'useContext(...)' as it is undefined.
reactuseContextnextjslỗi-javascript
reactbeginner

Fix React Warning: Each Child in a List Should Have a Unique "key" Prop

Warning: Each child in a list should have a unique "key" prop.
reactkeydanh sáchmap
reactbeginner

Sửa lỗi 'No routes matched location' trong React Router

No routes matched location "/dashboard"
reactreact-routerroutingspa
reactintermediate

Fix React Màn Hình Trắng (Blank Page): App Không Render Được Mà Không Có Lỗi Console

Blank white screen with no errors in the browser (React app fails to render)
reactwhite-screenblank-pagebuild
reactbeginner

Sửa lỗi "Objects are not valid as a React child" trong React

Objects are not valid as a React child. If you meant to render a collection of children, use an array instead.
reactrenderobjectjson
reactbeginner

Sửa lỗi "Invalid hook call. Hooks can only be called inside of the body of a function component." trong React

Invalid hook call. Hooks can only be called inside of the body of a function component.
reacthooksrules-of-hooksfunction-component
reactintermediate

Fix React Memory Leak: Warning Can't Perform a React State Update on an Unmounted Component

Warning: Can't perform a React state update on an unmounted component.
reactmemory-leakunmountuseEffect
reactintermediate

Fix useEffect Infinite Loop: Warning Maximum Update Depth Exceeded trong React

Warning: Maximum update depth exceeded. This can happen when a component calls setState inside useEffect.
reactuseEffectinfinite-loopdependency-array
reactintermediate

Sửa lỗi "Cannot update a component from inside the function body of a different component" trong React

Cannot update a component from inside the function body of a different component.
reactcập nhật-statelifecycleside-effect
reactintermediate

Sửa lỗi Hydration Mismatch: "Hydration failed because the initial UI does not match what was rendered on the server"

Hydration failed because the initial UI does not match what was rendered on the server.
reacthydrationssrnextjs
reactintermediate

Sửa lỗi "Too many re-renders" trong React Component

Too many re-renders. React limits the number of renders to prevent an infinite loop.
reactre-rendervòng-lặp-vô-hạnstate
reactbeginner

Sửa lỗi TypeError: Cannot read properties of undefined (reading 'map') trong React

TypeError: Cannot read properties of undefined (reading 'map')
reactundefinedstateprops