# Props

kyman19940214

오늘은 1차 프로젝트를 진행하면서 이해하기 제일 어려웠던 props 와 state 를 복습하는 시간을 갖도록 하겠습니다.컴포넌트 내부의 immutable DataJSX 내부에 {this.props.propsName}컴포넌트를 사용할 때, <> 괄호 안에 props

hipiction

React의 핵심 개념인 props, state, life cycle 그리고 functional component와 class component에 대해 공부합니다.

sji7532

React Props > Props는 컴포넌트의 속성값입니다. 부모 컴포넌트로부터 전달 받은 데이터를 지니고 있는 객체입니다. 부모 컴포넌트로부터 자식 컴포넌트에게 state Props 객체 > props는 부모 컴포넌트로부터 전달 받은 데이터를 지니고 있는 객체

dustjd1535

React에서 props는 변하지 않는 데이터 (Immutable Date)이다. 상위 (부모) 컴포넌트에서 하위(자식) 컴포넌트로 데이터를 넘겨줄 때 사용한다. Login.js 는 상위(부모) 컴포넌트 이다. 부모 컴포넌트안에 <Child/>컴포넌트를 impor

kyman19940214

props는 properties의 줄임말로 컴포넌트의 속성값입니다, 부모 컴포넌트로부터 전달 받은 데이터를 지니고 있는 객체로서 props를 통해 부모 컴포넌트로부터 자식 컴포넌트에게 state의 상태값, event handler를 넘겨줄 수 있습니다.클래스형 컴포넌트

kyman19940214

state: 컴포넌트 내부에서 가지고 있는 컴포넌트의 상태값입니다. State는 화면에 보여줄 컴포넌트의 정보(상태)를 지니고 있는 객체입니다.클래스형 컴포넌트에서 state, 즉 해당 컴포넌트의 상태를 정의해보겠습니다.Class component | state클래스형

lets_gojae

Props는 속성을 나타내며 한 구성 요소에서 다른 요소로 데이터를 전달하는데 사용 (Props : Properties)Props가 있는 데이터가 단방향 흐름으로 전달 된다는 것 입니다.(부모에서 자녀로의 편도)Props를 통해 부모 컴포넌트부터 자식 컴포넌트에게 st

lets_gojae

변경될 수 있는 데이터를 처리할 때 효율적으로 사용될 수 있습니다.state는 컴포넌트안에서 관리state는 화면에 보여줄 컴포넌트의 정보(상태)를 지니고 있는 객체닙니다.state는 컴포넌트 내에서 정의하고 사용하며 얼마든지 데이터(객체)가 변경될 수 있습니다.클래스

sji7532

Component > 컴포넌트란 재사용 가능한 UI단위를 말합니다. 만약 자신이 회원가입 페이지의 로그인 창 등 여러가지를 만들었는데, 정보 수정 하는 페이지를 추가하게 되어 비밀번호 input을 만들어야 한다면 반복되는 부분을 하나의 컴포넌트로 만들어 똑같은 디자

mountain

내가 전달받은 props가 원하는 props인지 확인할 수 있다.package.json 추가 npm install prop-typescomponent 추가 import PropTypes from 'prop-types';꼭 있어야하는 필수 체크가 아님. 그렇기 때문에 값

choidy180

하나의 컴포넌트가 가질 수 있는 변경 가능한 데이터

cloudlee711

일단 React는 실행이 된다면 class 내의 constructor, render, componentDidMount순으로 호출이 되며 setstate 발생시 rerender가 된다!

hurima90

props는 properties를 줄인 표현으로 컴포넌트 속성을 설정할 때 사용하는 요소입니다. props 값은 해당 컴포넌트를 불러와 사용하는 부모 컴포넌트에서 설정할 수 있습니다.

jjo-niixx

동일 코드가 반복되는 부분을 하나의 comopnent로 만들어 재사용 가능한 UI 단위.하나의 컴포넌트에 필요한 html, css, js를 모두 합쳐서 만들 수 있다.독립적이고 재사용이 가능하다는 점에서 함수와 비슷한데, props라는 input을 받아서 React 요

zwon111

props 와 state 둘 다 컴포넌트에서 사용하거나 랜더링할 데이터를 담고 있어 비슷해보이지만 그 역할은 다르다. props 는 부모 컴포넌트 가 설정하고, state 는 컴포넌트 자체적으로 지닌 값 으로 컴포넌트 내부에서 값을 업데이트 할 수 있다.

zwon111

react에서 state는 컴포넌트 내부에서 바뀔 수 있는 값 을 의미한다. props는 컴포넌트가 사용되는 과정에서 부모 컴포넌트가 설정하는 값이다. 컴포넌트 자신은 해당 props를 읽기 전용 으로만 사용할 수 있다. cf) 앞에서, Mycomponent.js 의

zwon111

비구조할당 문법을 통해 props 내부 값을 추출.Mycomponent.jsMycomponent.js // ver.2

zwon111

Mycomponent.js 를 수정하여 해당 컴포넌트에서 name이라는 props를 렌더링하도록 설정하자. props 의 값은 컴포넌트 함수의 파라미터로 받아 와서 사용할 수 있다. props 를 랜더링할 때는JSX 내부에서 {} 로 감싸주어야 한다.App.js 컴포넌

cyheum

1. Component 프론트앤드 개발에서 Component 라는 단어를 많이 사용합니다. component(컴포넌트)란 재사용 가능한 UI 단위입니다. 동일 코드가 반복되는 부분을 하나의 component로 만들어서 같은 디자인의 input이 필요한 곳마다 재사용

claire-euni

부모 Component = < Nav />자식 Component = < Login />자식 Login.js ) this.props.showID(this.state.email) showID 라는 함수를 부모에게 전달해보자.showID 함수를 이용해서 자식 Lo