Front/React24 [React] useQuery 사용방법 useQuery is a React Hook provided by the react-query library, which allows for easy and efficient data fetching and caching. useQuery 는 리액트 훅 인데, 라이브러리 이고, 쉽고 효과적으로 데이터를 보내고, 저장 할 수 있는 녀석이다. useQuery automatically handles data caching and provides a range of other features, such as automatic refetching of data on mount or on specified intervals, polling for new data, and more. use query 는 자동적으로 .. 2023. 4. 13. [React] React CSS 스타일 css 스타일 width: ${(props) => (props.width != null ? `${props.width}px !important` : '250px !important')}; 다음처럼 사용하고 싶다면 export const CommonSegment = styled(Segment)` min-height: ${(props) => (props.minHeight != null ? `${props.minHeight}px !important` : '50px !important')}; ${(props) => props.marginLeft && css` margin-left: ${props.marginLeft}px !important; `} ${(props) => props.width && css` wid.. 2023. 4. 4. [React] The request was rejected because the URL contained a potentially malicious String "//" 다음에러는 https://chocoboy.tistory.com/manage 다음처럼 되어야 정상적으로 작동하겟지만, https://chocoboy.tistory.com//manage 다음처럼 // 가 두개 들어간것을 말한다. (당연히, 두개 들어가면 정상작동 안한다.) 고로 URL를 Request하는 코드에서 수정해주면 된다. To be continued.. 2023. 3. 22. [React] Data Select How can we select in react? (어떻게 조회할까 리액트에서?) Method import 'semantic-ui-css/semantic.min.css'; import React, { useState } from 'react'; import { Table } from 'semantic-ui-react'; import { HttpRequest } from '@utils/Http'; import { useLayoutEffect } from 'react'; interface DataRow { ID: number; TITLE: string; ATTACH_FILE: string; NAME: string; REGIST_DATE: string; manualData: DataRow[]; } const .. 2023. 3. 3. [React] How to straighten React pagination 정답은 textAlign : center Method 일반적으로 margin 으로 줄것이라고 생각을 하겠지만 페이지 네이션은 textAlign: center로 줘야지 가운데로 잡힌다. To be continued.. 2023. 2. 27. [React] React <></> Usage 리액트에서 을 사용하는 이유가 뭔지해가지고 찾아보았다. Method React fragment 가 뭐임 ? 아 그그 리액트에서 허용하는 여러 자식을 하나로 묶는 녀석임 처럼 묶는것과 같음 fragement 라고 부르는데 를 사용하면 element를 생성해야 되는데 그게 싫을 때는 로 사용하고 있음 근데 이건 리액트에서 만 사용이 가능함 다음 처럼 있을 자리에 을 보통 사용하는데 는 영역이 오른쪽 끝까지 포함이 되잖음? 이 녀석은 처럼 딱 이 요소만 들어가도록 함. To be continued.. 2023. 2. 27. [React] Replace `초기화` with `⏎········초기화⏎······` In this case , You have to change a line (이 경우 줄 바꿈 하라는것이다.) Definitely, This button isn't a problem according to the code Now It's working correctly To be continued.. 2023. 2. 24. [React] React export example 오늘은 export 사용 예제를 해보도록 하겠다. export usage 1 이런식으로 서브 파일의 export 를 해줄 수 있다. 다른 방법으로는 export를 직접하는것인데 export usage 2 이렇게 바닥에 있는 export { }; 를 지워주고 직접 함수 앞에 export를 선언한다면 import 해서 사용 할 수 있다. 다음 처럼 import해서 이용 할 수 있도록 하는것이 export 기능이다. 이것은 React 뿐만 아니라 Javascript에서 지원하느 기능이라고 한다. To be continued.. 2023. 2. 24. 이전 1 2 3 다음
