라벨이 부모 컴포넌트인 게시물 표시

[React] 자식 컴포넌트 state 값 부모 컴포넌트로 전달하기 및 불변성 유지

자식 컴포넌트 state 값 부모컴포넌트로 전달하기 방법을 간단히 보면 부모 컴포넌트에 함수를 정의하고 해당 함수를 자식 컴포넌트의 props로 전달한다. props로 전달된 함수를 호출해서 자식컴포넌트의 값을 부모 컴포넌트로 전달하도록 한다. App.js (부모 컴포넌트) import React , { Component , Fragment } from "react" ; import Child from "./components/Child" ; class App extends Component { handleData = ( data ) => { console . log ( data ); }; render () { return ( < > < Child sendProps = {this . handleData } /> </ > ); } } export default App ; Child.js (자식 컴포넌트) import React , { Component } from "react" ; export default class Child extends Component { state = { name : "" , age : "" , }; handleChange = ( e ) => { this . setState ({ [ e . target . name ]: e . target . value , }); }; handleSubmit = ( e ) => { e . preventDefault (); { this . props . sendProps ( this . state ); } }; render () { retu...