융융이'Blog

리액트의 라이플 사이클은 총 세가지 마운드, 업데이트, 언마운트 입니다. 라이플 사이클에서 주로 사용되는 함수들 render()함수 이 메서드는 컴포넌트 모양새를 정의합니다. 이 메서드 안에서 this.props와 this.state에 접근할 수 있으며, 리액트 요소를 반환합니다. 이 메서드 안에서 절대로 state를 변형해서는 안되며, 웹브라우저에 접근해서도 안됩니다. DOM 정보를 가져오거나 변환를 줄 때느 componentDidMount에서 처리 해야합니다. constructor 메서드 constructor(props){...} 이것은 컴포넌트의 생성자 메서드로 컴포넌트를 만들 때 처음으로 실행됩니다. 이 메서드에서는 초기 state를 정할 수 있습니다. ##componentDidMount메서드 이..

import React, {Component} from 'react'; class IterationSample extends Component{ render(){ const names = ['123', '345','567'] const nameList = names.map( (name, index) => ({name}) ) return ( {nameList} ) } } export default IterationSample; react에서는 배열을 나열할 때는 반드시 고유key를 정해줘야한다. 보통 key 값으로 index를 자주 사용한다.

REACT에서 지원하는 이벤트 종류 Clipboard Composition Keyboard Focus Form Mouse Selection Touch UI Image Wheel Animation Media Transition import React, {Component} from 'react'; class EventPractice extends Component { state = { message: "" } constructor(props){ super(props); this.handleChange = this.handleChange.bind(this); this.handleClick = this.handleClick.bind(this); } //값이 변화할 때 handleChange(e)..

구조가 MVC, MVW등인 프레임워크와 달리, 오직 V만 신경 쓰는 라이브러리입니다. DOM이란? Document Object Model의 약어입니다. 객체로 문서 구조를 표현하는 방법은 XML이나 HTML로 작성합니다. Virtual Dom 데이터를 업데이트하면 전체 UI를 Virtual Dom에 리렌더링합니다. 이전 Virtual DOM에 있던 내용과 현재 내용을 비교합니다. 바뀐 부분만 실제 DOM에 적용합니다.