Front120 [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. [Typescript] Argument of type 'string | undefined' is not assignable to parameter of type 'string | Blob'. 하 내적으로 정말 많이 심적으로 고통을 주는구나 타입스크립트..... 아직 내가 너를 제대로 이해하고 사용하고 있지 않기 때문이겠지-? Method 다음 에러가 뜨는 경우에는, undefined 를 할당 할 수 없다는 에러이다. 고로. Type를 어떻게 주었느냐가 문제가 되는건데, 이런 이슈가 발생하는 이유는 다음과 같다. export interface PostProps { TITLE?: string; CONTENT?: string; ATTACH_FILE?: Array; } 여기서 무엇이 틀린 것 같은가? 바로, TITLE ?: 이렇게 사용하지 말라는 것이다. ? 을 배제 시키라는 것인데, 그 이유로는 ?(물음표)는 undefined를 받아 들이기 때문이다. export interface PostProp.. 2023. 3. 24. [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. [Typescript] Property does not exist on type 'JSX.IntrinsicElements'. 이게 무슨 에러인가 싶었다 증말~~ Method 정말 이게 무슨 에러인지 말도 안된다는 생각이 들었다... 근데 알고보니까 타입스크립트 애러이다... 원인은 manualPagination 이것을 ManualPagnation 으로 바꿔주었다.. 타입스크립트은 맨앞에 나오는 스펠링이 대문자가 되어야한다. 이렇게 대문자로 적어주니까 아무 에러 없이 아주 잘 작동한다. 그럼 ㅎㅎㅎ 안농.... To be continued.. 2023. 2. 27. [React] React <></> Usage 리액트에서 을 사용하는 이유가 뭔지해가지고 찾아보았다. Method React fragment 가 뭐임 ? 아 그그 리액트에서 허용하는 여러 자식을 하나로 묶는 녀석임 처럼 묶는것과 같음 fragement 라고 부르는데 를 사용하면 element를 생성해야 되는데 그게 싫을 때는 로 사용하고 있음 근데 이건 리액트에서 만 사용이 가능함 다음 처럼 있을 자리에 을 보통 사용하는데 는 영역이 오른쪽 끝까지 포함이 되잖음? 이 녀석은 처럼 딱 이 요소만 들어가도록 함. To be continued.. 2023. 2. 27. 이전 1 2 3 4 ··· 15 다음
