본문 바로가기

Front-end6

[ antd ] antd table 의 pagination 한 페이지 열 갯수 설정하기 이렇게 pagination = {{pageSize: 10}} 넣어주면 한 페이지에 pageSize만큼의 열이 들어간다. 참조 https://github.com/ant-design/ant-design/issues/7477 How can we define the number of rows per page on the table pagination? like 10, 25, 50 etc · Issue #7477 · ant-design/ant-desi What problem does this feature solve? If we can define the number of rows per page on the table pagination, So we can set a number of rows on the sa.. 2023. 6. 19.
Recoil 사용 연습하기 - 2 atom 의 value를 감지하기 위해서 useRecoilValue const isDark = useRecoilValue(isDarkAtom); useRecoilValue 가 atom 을 넣으면 atom 값을 반환한다. atom 의 value set하기 위해 useSetRecoilState(Atom) 이렇게 하면 setter function 받을 수있음 const setterFn = useSetRecoilState(isDarkAtom); atom 을 받아서 atom 을 변경하는 함수를 반환 setState 처럼 사용하면 된다. const toggleDarkAtom = () => setDarkAtom((prev) => !prev); atom 이 변경되면 컴포넌트도 변경된 값으로 다시 리렌더링 된다. 2023. 4. 3.
Recoil 사용 연습하기 - 1 Recoil 개념 recoiil 에서 하나의 전역 상태는 Atom 이라고 부른다. Atom 은 어느 하나의 컴포넌트에 묶여있지 않고, 모든 컴포넌트에서 접근 가능한 하나의 그래프이다. Atom 상태를 구독하여 업데이트되는 Selector 혹은 Atom 을 자식으로 점점 붙여나갈 수 있다. Recoild 도 Redux처럼 단방향 데이터 흐름을 가진다. Recoil 을 사용하면 atoms(공유상태)에서 selectors(순수함수) 를 거쳐 React 컴포넌트로 내려가는 data-flow graph 를 만들 수 있다. Atoms은 컴포넌트가 구독할 수 있는 상태의 단위이다. Selectors는 atoms 상태값을 동기 또는 비동기 방식을 통해 변환한다. Atoms Atoms는 상태의 단위이며, 업데이트와 구독.. 2023. 3. 21.
[React] useEffect 란? useEffect 란 ? useEffect 란? useEffect(callback, [dependencies]) Effect 란? useEffect 는 왜 useEffect 라고 불리는걸까? effect 란 무엇일까? effect는 함수형 프로그래밍 용어인 "side effect" 를 의미한다. side effect 가 뭔지 이해하기 위해 먼저 pure function 에 대해 이해 해 보자 대부분의 react component는 pure function 이 되려고 한다. react component 를 함수라고 생각하는게 이상하겠지만 react component 는 함수다! 대부분의 react component는 pure function 이며 input을 받고 예측 가능한 JSX output을 만들어낸.. 2022. 11. 3.