Skip to content

[Migration] Warning: A component is changing an uncontrolled input to be controlled. This is likely caused by the value changing from undefined to a defined value, which should not happen. Decide between using a controlled or uncontrolled input element for the lifetime of the component #7

@HAMADOns

Description

@HAMADOns

Dans la solution de l'exo 1 quand on tape dans l'input ça affiche le warning suivant :

image

Warning: A component is changing an uncontrolled input to be controlled. This is likely caused by the value changing from undefined to a defined value, which should not happen. Decide between using a controlled or uncontrolled input element for the lifetime of the component. More info: https://reactjs.org/link/controlled-components
at input
at form
at div
at Login (webpack-internal:///(app-pages-browser)/./src/final/01.js:11:66)
at App
at PracticeContent (webpack-internal:///(app-pages-browser)/./src/app/components/(app)/(practice)/pratice-content.tsx:7:11)
at NoSSR (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/[email protected]
@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/shared/lib/lazy-dynamic/dynamic-no-ssr.js:13:11)
at Suspense
at InnerLayoutRouter (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/layout-router.js:240:11)
at RedirectErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/redirect-boundary.js:72:9)
at RedirectBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/redirect-boundary.js:80:11)
at NotFoundBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/not-found-boundary.js:62:11)
at LoadingBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/layout-router.js:315:11)
at ErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/error-boundary.js:130:11)
at InnerScrollAndFocusHandler (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/layout-router.js:151:9)
at ScrollAndFocusHandler (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/layout-router.js:226:11)
at RenderFromTemplateContext (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/render-from-template-context.js:15:44)
at OuterLayoutRouter (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/layout-router.js:325:11)
at InnerLayoutRouter (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/layout-router.js:240:11)
at RedirectErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/redirect-boundary.js:72:9)
at RedirectBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/redirect-boundary.js:80:11)
at NotFoundBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/not-found-boundary.js:62:11)
at LoadingBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/layout-router.js:315:11)
at ErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/error-boundary.js:130:11)
at InnerScrollAndFocusHandler (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/layout-router.js:151:9)
at ScrollAndFocusHandler (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/layout-router.js:226:11)
at RenderFromTemplateContext (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/render-from-template-context.js:15:44)
at OuterLayoutRouter (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/layout-router.js:325:11)
at InnerLayoutRouter (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/layout-router.js:240:11)
at RedirectErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/redirect-boundary.js:72:9)
at RedirectBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/redirect-boundary.js:80:11)
at NotFoundBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/not-found-boundary.js:62:11)
at LoadingBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/layout-router.js:315:11)
at ErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/error-boundary.js:130:11)
at InnerScrollAndFocusHandler (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/layout-router.js:151:9)
at ScrollAndFocusHandler (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/layout-router.js:226:11)
at RenderFromTemplateContext (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/render-from-template-context.js:15:44)
at OuterLayoutRouter (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/layout-router.js:325:11)
at body
at html
at InnerLayoutRouter (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/layout-router.js:240:11)
at RedirectErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/redirect-boundary.js:72:9)
at RedirectBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/redirect-boundary.js:80:11)
at NotFoundErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/not-found-boundary.js:54:9)
at NotFoundBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/not-found-boundary.js:62:11)
at LoadingBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/layout-router.js:315:11)
at ErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/error-boundary.js:130:11)
at InnerScrollAndFocusHandler (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/layout-router.js:151:9)
at ScrollAndFocusHandler (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/layout-router.js:226:11)
at RenderFromTemplateContext (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/render-from-template-context.js:15:44)
at OuterLayoutRouter (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/layout-router.js:325:11)
at InnerLayoutRouter (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/layout-router.js:240:11)
at RedirectErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/redirect-boundary.js:72:9)
at RedirectBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/redirect-boundary.js:80:11)
at NotFoundErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/not-found-boundary.js:54:9)
at NotFoundBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/not-found-boundary.js:62:11)
at LoadingBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/layout-router.js:315:11)
at ErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/error-boundary.js:130:11)
at InnerScrollAndFocusHandler (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/layout-router.js:151:9)
at ScrollAndFocusHandler (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/layout-router.js:226:11)
at RenderFromTemplateContext (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/render-from-template-context.js:15:44)
at OuterLayoutRouter (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/layout-router.js:325:11)
at RedirectErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/redirect-boundary.js:72:9)
at RedirectBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/redirect-boundary.js:80:11)
at NotFoundErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/not-found-boundary.js:54:9)
at NotFoundBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/not-found-boundary.js:62:11)
at DevRootNotFoundBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/dev-root-not-found-boundary.js:32:11)
at ReactDevOverlay (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/react-dev-overlay/internal/ReactDevOverlay.js:66:9)
at HotReload (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/react-dev-overlay/hot-reloader-client.js:295:11)
at Router (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/app-router.js:159:11)
at ErrorBoundaryHandler (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/error-boundary.js:100:9)
at ErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/error-boundary.js:130:11)
at AppRouter (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/components/app-router.js:436:13)
at ServerRoot (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/app-index.js:128:11)
at RSCComponent
at Root (webpack-internal:///(app-pages-browser)/./node_modules/.pnpm/next@14.0.4_@babel[email protected][email protected][email protected][email protected]/node_modules/next/dist/client/app-index.js:144:11)

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions