Front-End34 React: flushSync 활용 beforeprint, afterprint 이벤트 처리 회사에서 jquery 를 사용한 프로젝트를 React 로 포팅하는 도중 beforeprint, afterprint 이벤트를 처리하는 함수를 마주했습니다. window.print() 를 호출하기 전, 화면의 특정 요소를 숨기고(.hide())사용자가 print 화면을 닫게 되면 다시 화면의 특정 요소를 보여주는(.show()) 로직이었습니다. printing이라는 상태를 통해 요소를 숨기고 보여주는 코드를 아래와 같이 작성했습니다.import { useState, useEffect } from "react";const printingExample = () => { const [isPrinting, setIsPrinting] = useState(false); const handleBeforeprint =.. 2024. 8. 1. cannot use jsx unless the '--jsx' flag is provided 국문으로는 --jsx가 설정되지 않았습니다 오류다. VS Code 의 타입스크립트 버전과 PC에 global 설치 된 Typescript 버전이 달라서 발생하는 오류로VS Code의 [setting 메뉴]에서 [settings.json 으로 설정하기] 를 눌러 json 내 아래와 같은 값을 입력해 주면 된다. { "typescript.tsdk": "$GLOBAL_NPM_PATH/typescript/lib"} 2024. 7. 12. scroll-behavior 브라우저가 유저의 페이지 스크롤을 어떻게 동작시킬지 명시한다. value 타입- smooth : 부드러운 스크롤. - auto(or instant) : 부드러운 효과 없이 즉시 스크롤. default 값. https://developer.mozilla.org/ko/docs/Web/CSS/scroll-behavior 스크롤 동작 - CSS: Cascading Style Sheets | MDNscroll-behavior CSS 속성은 문서 탐색 또는 CSSOM 스크롤 API에 의하여 스크롤이 트리거될 때 스크롤을 포함하는 박스의 동작을 설정합니다.developer.mozilla.org 2024. 7. 8. 브라우저 기본 CSS 스타일 초기화 : Reset CSS https://meyerweb.com/eric/tools/css/reset/ CSS Tools: Reset CSSCSS Tools: Reset CSS The goal of a reset stylesheet is to reduce browser inconsistencies in things like default line heights, margins and font sizes of headings, and so on. The general reasoning behind this was discussed in a May 2007 post, if you're intermeyerweb.com 브라우저별로 기본 CSS 설정이 다른 부분을 해주는 소스 2024. 7. 7. 이전 1 2 3 4 ··· 9 다음