코딩 오답 노트장

import React from 'react'; import axios from 'axios'; class MemberInfo extends React.Component{ state = { } render(){ return( ) } } export default MemberInfo;

사용되는 변수(state) : state = { //댓글 삭제 모달 delCommentModal: false, delCommentConfirmStatus: 0, delCommentSeq: 0, }; 값에 따른 다양한 모습 {/* 삭제 모달 */} { { 0: 정말로 삭제하시겠습니까? delComment(delCommentSeq)}> 확인 delCommentModalClose()}> 취소 , 1: 삭제되었습니다. delCommentModalClose()}> 확인 } [delCommentConfirmStatus] }

//업데이트시 적용 componentDidUpdate() { this.autoHeight(); } // textarea 자동 높이조절 autoHeight = () => { $('.postViewCommentInput').keyup(function(e) { $(this).css('height', 'auto'); $(this).height(this.scrollHeight); }) } 쩐다

사용이유 가변성이 큰 객체를 생성할 때 state로 하나하나 지정해주면 너무 state변수가 많아지고 불필요해짐 따라서 변수를 초기화시키면서 배열로 동적 생성시킬 방법인데 setState를 이용해 편법처럼 사용하는것임 사용방법 1. 전역 변수로 변수를 선언 (class(comp) 바깥쪽) let timeStrDate = []; 2. 변수들을 배열에 넣어줌 getDate = (num) => { timeStrDate = []; for(var i=0; i ( {date} ) ) ... {timeDate} } 5. 이제 getDate()를 호출하면 변수가 state처럼 동적으로 변함!

글자 수 길이 체크 //길이 검사 checkLength = (title, contents, broadTitle, broadSummary) => { const texts = [title, contents, broadTitle, broadSummary]; const fieldShow = ["제목", "신청내용", "방송 제목", "방송 요약"]; const limit = [30, 1000, 20, 200]; for(var i=0; i

https://foxtrotin.tistory.com/219 React-컴포넌트 반복(map()과 key) HTML을 보면 반복되는 코드를 작성할 때가 있다 1번 2번 3번 이런 건 어떻게 효율적으로 바꿀 수 있을까? map()함수를 써봅시다 map() 맵은 파라미터로 전달된 함수로 배열 내 각 요소를 프로세싱하고 foxtrotin.tistory.com

3항 연산자, if문 두가지 방법이 있음 3항 연산자 사용법 .map(id => { return this.props.schema.collectionName.length { if(this.props.schema.collectionName.length < 0) return return hejsan } 출처 : https://stackoverflow.com/questions/44969877/if-condition-inside-of-map-react If condition inside of map() React I have a map()function that needs to display views based on a condition. I'v..

매개변수 값에 따라 State 키를 다르게 지정하는 방법 //모달 창 활성화 modalOpen = (e) => { let modal = e.adminCheck this.setState({ ["modal"+modal]: true }) }

row.map((rank, i, row) => { if (i + 1 === row.length) { // Last one. } else { // Not last one. } }) 출처 : https://stackoverflow.com/questions/38176352/javascript-map-array-last-item Javascript Map Array Last Item I have this: map = ranks.map((row, r) => ( row.map((rank, i) => { return [element(r, i, state, rank, toggled, onClick)]; }) )); It maps through a 2-dimentional array. After each row... s..

첫번째 전체 키 사용 inputChangeHandler (event) { var stateObject = function() { returnObj = {}; returnObj[this.target.id] = this.target.value; return returnObj; }.bind(event)(); this.setState( stateObject ); }, ES6 또는 Babel 변환기를 사용해 JSX 코드를 변환하는 경우 -> 더욱 단순하게 사용 가능 inputChangeHandler (event) { this.setState({ [event.target.id]: event.target.value }); // alternatively using template strings for strings /..