개발노트

render의 jsx안에서 for if못쓴다 조건문 걸때는 삼항연산자 사용 render(){ {this.state.message} {this.state.result.length !== 0 && 평균시간: {this.state.result.reduce((a,c)=>a+c) / this.state.result.length} ms } } { 조건 ? T : F } 이조건이아니면 이거 해줘 일땐, true자리에 그냥 null쓰면 된다. { 조건 && T } getAverage = () => { const { result } = this.state; return result.length !== 0 && 평균시간: {result.reduce((a,c)=>a+c) / result.length} ms } render(..

render안에 setState넣으면 둘이 계속 호출해되서 무한반복 일으키니 사용하지 말것- 부모로 받은 props를 state에 넣을 수 있다 import React , {meno} from 'react'; const TryList = memo( ({ tryInfo }) => { tryInfo.try='hi'; // (x) return( {tryInfo.try} {tryInfo.result} ) }); export default TryList; 부모로 받은 자식이 props를 바꾸면 안된다. 부모가바꿔야 함. 어쩔수없이바꿔야 할 경우 (1)props를 state에 넣어준다 import React , {useState, memo} from 'react'; const TryList = memo( ({ tr..

state랑 props가 바뀌어야만 렌더링 되야 되는데. state값이 바뀌는 이벤트가 아니더라도 render링이 다시 되는 문제가 있다 import React, { Component } from 'react'; class Counter extends Component { state = { counter: 0, } onClick = () =>{ this.setState({}); } render (){ console.log('렌더링'); return( click ! ) } } Class Component 1. shouldComponentUpdate 그래서 shouldComponentUpdate라는 메서드를 사용 (이럴경우에 렌더링을 해줘라고 다시 지정하는것) 성능최적화를 해야한다 shouldComponen..

(클래스컴포넌트에서) 매서드 화살표 함수 대신 매서드로 사용하려면 class Number extends Component{ constructor(props){ super(props); this.state = { result: '', value: '', answer: getNumbers(), tries:[] }; this.onSubmitForm = this.onSubmitForm.bind(this); //여기 this.onChangeInput = this.onChangeInput.bind(this); } onSubmitForm (e){ e.preventDefault(); console.log(this.state.value); } //사용자입력값 onChangeInput (e){ console.log( th..