# State

80개의 포스트

[React] 5. State와 LifeCycle

컴포넌트 내에서 동적으로 변동되는 데이터를 관리하며, 기본값(Default Value)이 미리 설정해야 사용할 수 있다.State는 비공개이며 컴포넌트에 의해 완전히 제어된다.클래스 컴포넌트에서 사용이 가능하다. 함수형 컴포넌트는 Hooks를 사용우선 State는 클래

어제
·
0개의 댓글

#27. React(Props)

Props props의 기본값 설정하는 방법은 Child Component에 아래 굵은 부분을 입력하는 것입니다. ** static defaultProps = { name: 'PresentPark' }** 간단하게 Props를 이용해서 이름을 가져오는 컴포

3일 전
·
0개의 댓글

리액트 시작하기(state란?) #3

리액트에서 매\~~우 중요한 개념중 하나로 상태값이란것이 있다!데이터를 보관하는 박스(?) 같은 역할을 한다이 상태값을 다루는 방법도 클래스형과 함수형컴포넌트에서 차이점을 보이는데, 클래스형은 복잡하다....사실 여기에서 최근 클래스형을 안쓰고 함수형으로 쓰는 추세로

4일 전
·
0개의 댓글
post-thumbnail

[TIL] 상태관리, Local과 Store

누군가에게 이런 얘기를 들었던 적이 있다. React / Redux를 사용하면서 onChange같은건 하나 만들어놓고 가져와서 계속 사용할 수 있는거 아니야? 라고 생각했었다.React state는 컴포넌트 지역에서 저장되는 값으로 하위 컴포넌트에 props를 활용하여

2020년 11월 18일
·
0개의 댓글

리액트 네이티브 state 와 props 이해하기

우선 기본 화면인 App.js 파일의 App class에 아래와 같이 작성하였다.말이 어려운거 같지만, 쉽게 얘기하자면, 앱을 실행시킬때 출력되는 화면을 나타내는 데이터들을 다룬다는 말이다. state는 그만큼 중요하다. 위의 코드와 같이 render함수 밖에 stat

2020년 11월 14일
·
1개의 댓글
post-thumbnail

리액트 처음부터 다시하기.6

여기 아주 기본적인 이벤트가 하나 있다. 아주 기본적이면서 우리가 웹에서 스크롤 다음으로 많이 하는 클릭 이벤트다.작성 할 때에는 이벤트종류 = 실행 할 함수 를 써주게 된다. 위의 함수는위 사진의 WEB 이라는 글자로 된 링크를 '클릭' 하면 경고창을 띄우는 함수다.

2020년 11월 13일
·
0개의 댓글
post-thumbnail

리액트 처음부터 다시하기.5

event 이때까지 state 에 저장된값에 따라 component의 상태를 바꾸거나, props를 통해 자식 component에게 state값을 전달하는 방식을 알아보았다.. 이번엔 특정조건에 맞춰 state값이 변경되면 결과물이 바뀌는 과정을 알아보자. 이

2020년 11월 13일
·
0개의 댓글
post-thumbnail

리액트 처음부터 다시하기.4

state는 component 내부의 값을 바꾸는데 사용된다. 앞에서봤던것 처럼 부모 컴포넌트의 정보를 자식 컴포넌트에 보내기 위해선, 즉, 자식 컴포넌트의 내용을 부모컴포넌트가 준 내용으로 바꾸려면 props를 이용한다.그리고 그 component의 특정부분의 값을

2020년 11월 13일
·
0개의 댓글
post-thumbnail

React: Props, State, and Event

리액트 ㅋ

2020년 11월 8일
·
0개의 댓글
post-thumbnail

React | State

리액트 컴포넌트에서 다루는 데이터는 두가지로 나뉜다.statepropsprops는 나중에 배우겠지만, 미리 간단하게 설명하자면 props는 부모 컴포넌트가 자식 컴포넌트에게 주는 값이다. 단방향성 특징을 가지고 있어, 자식 컴포넌트가 부모 컴포넌트에서 값을 줄 수 없고

2020년 11월 7일
·
0개의 댓글
post-thumbnail

React | Component의 State

state란 말 그대로 컴포넌트의 상태 값입니다. state와 props는 둘 다 object이고, 화면에 보여줄 정보(상태)를 가지고 있다는 점에서 서로 비슷한 역할을 합니다. props는 컴포넌트를 사용하는 부모쪽에서 전달해야만 사용할 수 있고, state는 컴포넌

2020년 11월 2일
·
0개의 댓글

TIL 40 day setState는 비동기로 작동합니다!

이번 프로젝트를 하면서 절절히 느낀 점 중 하나는 비동기를 이해해야 코드를 제대로 짤 수 있다라는 것이었다. 리액트에서 state 관리는 값을 관리하는데 있어 무엇보다도 중요했는데 특히 state는 직접 변경하면 안 되고 무조건 setState를 이용해 변경해야했다.

2020년 11월 1일
·
0개의 댓글
post-thumbnail

TIL 39 day react 자식에서 부모로 state 넘기기

react에서는 부모에서 자식으로 부모의 상태값을 넘길 수도 있고 자식에서 부모로 자식의 상태값을 넘길 수도 있다. 이번 프로젝트에서 이 부분을 거의 쓸 곳이 없었는데다가 그나마 써볼 수 있는 부분도 자식에서 부모로 state 넘기는 걸 실패하는 바람에 사실상 이번 프

2020년 11월 1일
·
0개의 댓글
post-thumbnail

[React] 5. 컴포넌트와 구성요소(props, state)

오늘은 컴포넌트를 알아보겠습니다.컴포넌트는 리액트에서 가장 중요한 요소입니다.기존의 웹 프레임워크는 MVC방식으로 MVC방식은 정보(model), 화면(view), 구동(controller)로 코드관ㄹㅣ를 효율적으로 할 수 있다는 장점이 있으나 각 요소의 의존성이 높

2020년 10월 19일
·
0개의 댓글

[ React : State, Props, Event (실습) - 2. event 발생을 통한 state 변경 ]

Event & setState > event로 state 상태 속성 변경해주기 요소에서 onClick event 발생 this.handleColor, 즉 현재 component(state)의 handleColor 함수 실행 handleColor 함수 실행 시 se

2020년 10월 18일
·
0개의 댓글

[ React : State, Props, Event (실습) - 1. state 활용 ]

State 활용App.js : constructor에서 지정한 state 상태 속성{ color }을 render 함수의 input의 value 값에 접근하여 inline style로 받아왔다. 즉 "red" State(객체 그 자체)의 객체 속성을 이용하여 객체

2020년 10월 18일
·
0개의 댓글
post-thumbnail

ReturnType<typeof '___'>

typesctipt + redux > reducer > action type 작성부분reducer의 action 타입을 지정해주기 위해 'type alias'를 작성하고 있었음reducer의 switch 구문에서 조건으로 들어갈 타입의 실제 값이 필요했음첫번째 방법그

2020년 10월 11일
·
0개의 댓글

[TIL] 2020/10/06

Today, I Learned 선언형 vs 명령형(절차형) 한번더 공부하기 : 참조 사이트 리액트(react)는 어제도 정리했지만, 자바스크립트 라이브러리로, 주요한 특징으로는 'User Interface(UI)' 를 Component 단위로 관리한다는 것이다

2020년 10월 6일
·
0개의 댓글