Slowly, Steadily, Surely 👩‍💻

- 조건이 있을 때 temp = temp.map((el: any) => (el.index === selectedData[i].index ? { ...el, rowType: '삭제' } : el)); selectedDatas는 현재 선택되어 있는 행을 말한다. (ag grid) 선택되어 있는 index과 temp에 있는 index 값이 같으면 rowType에 '삭제'라는 값을 준다. const newData = callListcp.map((item: any) => ({ ...item, campaignName: initCampaignList?.find((el) => el.cdId === String(item.id))?.cdNm }));

duration에 대해 합계가 필요한 통계 그리드가 있다. const columnDefs = [ ... (생략) { headerName: 'duration', field: 'duration', enableValue: true, aggFunc: 'sum', width: 150, minWidth: 150, cellStyle: { textAlign: 'center' } } ]; 다른 컬럼들처럼 aggFunc: 'sum'을 써주었는데, 계속 합계가 생기지 않는 문제가 있었다. 이유는 바로.. duration이 text로 넘어왔기 때문. 숫자여야만 sum을 할 수 있어서, duration에 대한 합계가 만들어지지 않았다. 그래서 duration을 float으로 받고 나서 valueFormatter을 통해 시간 형..

temp = 데이터셋 name이라는 특정 문자열 컬럼 기준으로 정렬하려면 이렇게 하면 된다. if (temp.length > 0) { temp.sort((a: { name: string }, b: { name: string }) => { return a.name.localeCompare(b.name); }); }

https://yejinrla.tistory.com/68 [ React ] AG-GRID applyTransaction 행추가(add), 행삭제(remove), 행수정(update) 기능 구현하기 AG-GRID를 이용해서 그리드 행추가, 행삭제, 행수정 기능을 구현하려고 했다. 검색을 해보니까 생각보다 잘 나와있지 않아서 포스팅해본다. import { GridApi } from 'ag-grid-community' 일단 GridApi를 import 해 yejinrla.tistory.com 예전에 이 글을 올린적이 있었다. 맨 마지막 줄에 보면 데이터셋은 반영되지 않는다고 써있다. 생각해보면 당연하긴 하다. 데이터셋은 useState로 따로 선언되고 관리되고 있으니... const selectedData: ..

* 구조 화면에 2개의 그리드가 존재. 왼쪽 그리드 행을 클릭하면 상세 정보가 오른쪽 그리드에 뜸. * 만들고자 했던 기능 왼쪽 그리드 행을 클릭한 후 상세 정보를 수정중에 왼쪽 그리드 다른 행을 클릭할 때 '작성중입니다. 저장하지 않고 조회 진행하시겠습니까?' alert 창이 뜰 수 있게 하고, 확인을 누르면 조회를 진행 / 취소를 누르면 현상태를 유지시키려고 했다.(return) * 문제 발생 return을 시켜도, 다른 행을 클릭했던게 계속 남아있었다. 왼쪽 그리드에서 클릭된 행과 오른쪽 그리드의 상세정보가 서로 맞지 않게 된 것. * 해결 방안 강제로 다시 기존 행을 클릭하도록 만들기로 했다. 이때 setSelected 함수를 사용했다. forEachNode는 모든 노드를 다 보는데 (map같은 ..

특정 시간이라는 행에 데이터를 입력할 때 입력 문자를 제한할 수 있다. { headerName: '시간', field: 'time', editable: true, valueParser: (params: ValueParserParams) => { if (new RegExp(/[^0-9+:]/).test(params.newValue)) { dispatch({ type: SNACKBAR_OPEN, message: 'hh:mm:ss 형식으로 입력해주세요.', alertSeverity: 'info' }); return params.oldValue; } return params.newValue; } }, 숫자와 : 문자가 아니면 'hh:mm:ss 형식으로 입력해주세요.' 라는 메세지가 뜨는 코드이다.

const temp = 'a,b,c,d' json으로 변환하면 "a,b,c,d"로 나온다. 나는 ["a","b","c","d"] 이런 형식을 원한다. 대괄호로 덮어줘도 ["a,b,c,d"]로 나왔다. 계속 json으로 어떻게 바꿔야하지만 생각하다가, 배열로 먼저 바꿔보기로 했다. const array = temp.split(','); 이렇게 해주면 ['a','b','c','d'] 로 변환된다!

5초 뒤에 reSearch 함수 실행 setTimeout(() => reSearch(), 5000);

1. object를 배열로 바꾸기 { samsung: 1, apple: 2, lg: 3} 이런 object가 있다고 해보자. 제조사 번호 samsung 1 apple 2 lg 3 이걸 그리드에 제조사/번호로 뿌려주고 싶다. object에서 key, value를 뽑을 때 배열로 치환을 해줘야 한다. https://eloquence-developers.tistory.com/169 [JavaScript] Object.keys, values, entries Object.keys(obj) // 객체의 키만 담은 배열을 반환 Object.values(obj) // 객체의 값만 담은 배열을 반환 Object.entries(obj) // 객체의 키-값 쌍을 담은 배열을 반환 아래 예제를 통해서 위 메서드들의 쓰임새....

https://boxfoxs.tistory.com/427 typescript 3.7 소개 최근 이직을 한 후 개인적으로 '공부' 라는 것과 거리가 멀어져서 포스팅을 쓰면서 다시 시작해보고자 합니다. 마침 최근에 typescript 3.7이 새롭게 공개돼서 해당 문서를 번역해서 간단히 소개해 boxfoxs.tistory.com userId ?? '' userId가 null이나 undefined라면 ?? 오른쪽 값이 반환된다고 한다. null이나 undefined가 아니라면 그대로 userId값이 반환되는 것.