일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
- Next13
- RTK Query
- react hook
- background setttimeout
- notFound()
- background: url
- next13 head
- Render Props
- CSS
- React 공식문서
- hook
- background setInterval
- React 18
- Nextjs
- React 고급 안내서
- react-helmet
- Javascript
- Babel
- context
- react
- React 18 Nextjs
- background tab
- codingtest
- React API 참고서
- Nextjs React 18
- Programmers
- 고급안내서
- getUTCDate
- React18
- React 고급안내서
- Today
- Total
목록(구)React 공식문서/API 참고서 (7)
akjfal
합성 이벤트(SyntheticEvent) 개요 이벤트 핸들러는 모든 브라우저에서 이벤트를 동일하기 처리하기위해 SyntheticEvent 객체를 전달받습니다. 만약 브라우저의 고유 이벤트가 필요하다면 nativeEvent를 참조하고, 합성 이벤트는 고유 이벤트에 직접 대응되지 않고, 서로 다른 이벤트입니다. boolean bubbles boolean cancelable DOMEventTarget currentTarget boolean defaultPrevented number eventPhase boolean isTrusted DOMEvent nativeEvent void preventDefault() boolean isDefaultPrevented() void stopPropagation() boole..
합성 이벤트(SyntheticEvent) 개요 이벤트 핸들러는 모든 브라우저에서 이벤트를 동일하기 처리하기위해 SyntheticEvent 객체를 전달받습니다. 만약 브라우저의 고유 이벤트가 필요하다면 nativeEvent를 참조하고, 합성 이벤트는 고유 이벤트에 직접 대응되지 않고, 서로 다른 이벤트입니다. boolean bubbles boolean cancelable DOMEventTarget currentTarget boolean defaultPrevented number eventPhase boolean isTrusted DOMEvent nativeEvent void preventDefault() boolean isDefaultPrevented() void stopPropagation() boole..
DOM 엘리먼트 ※ 공식 사이트에 한글로 번역이 이미 되어있으니 원문을 보시는 것을 추천드립니다. React는 성능 및 호환성을 위해 브라우저 독립적인 DOM 시스템을 구현합니다. React는 대부분의 속성에서 카멜 케이스를 사용하지만 aria-*와 data-*는 예외입니다. Attribute의 차이 React와 HTML사이에는 다르게 작동하는 여러가지의 어트리뷰트들이 있습니다. checked 이 checkbox나 radio type 일 때 사용합니다. → 제어 컴포넌트에서 유용 defaultChecked는 컴포넌트가 처음 마운트 될 때 선택여부 설정 → 비제어 컴포넌트에서 사용 className CSS class를 사용하려면 className attribute를 사용하세요. 모든 일반적인 DOM 및 S..
ReactDOMServer ReactDOMServer객체를 통해 컴포넌트를 정적 마크업으로 렌더링 할 수 있습니다. Reference renderToPipeableStream() ReactDOMServer.renderToPipeableStream(element, options) 초기 html을 렌더링합니다. 인라인 ', { status: 500, headers: {'Content-Type': 'text/html'} }); ); renderToStaticNodeStream() ReactDOMServer.renderToStaticNodeStream(element) data-reactroot와 같이 React에서 내부적으로 사용하는 추가적인 DOM attribute를 만들지 않습니다. 여분의 attribute..
ReactDOMClient ※ 공식 사이트에 한글로 번역이 되어있으니 원문을 보시는 것을 추천드립니다. createRoot() DOM에 root를 추가할 때 사용합니다. 2가지 옵션이 존재합니다. onRecoverableError: error에서 자동적으로 회복하기 위해 호출하는 콜백함수입니다. identifierPrefix: React.useId에서 만들어지는 id입니다. multi root에서 충돌을 방지하기 위해 사용합니다. 서버와 같은 prefix를 사용해야만 합니다. hydrateRoot() createRoot와 같지만 이는 ReactDOMServer에서 동작합니다. createRoot와 동일한 옵션을 사용합니다.
ReactDOM ※ 공식 사이트에 한글로 번역이 되어있으니 원문을 보시는 것을 추천드립니다. react-dom은 DOM에 특화된 메소드입니다. react-dom은 react-dom/client, react-dom/server 둘로 나눠져있습니다. createPortal() React DOM외부에 react 컴포넌트 구조를 만들 수 있는 함수입니다. flushSync() 리엑트가 강제적으로 업데이트 되도록 강제합니다.
React 최상위 API ※ 공식 사이트에 한글로 번역이 이미 되어있으니 원문을 보시는 것을 추천드립니다. 개요 script를 통해서 React를 불러올 경우 전역객체에서 사용할 수 있고, npm에서 es6를 사용 할경우 import, es5일 경우 require(’react’)를 사용하면 됩니다. 컴포넌트 React 컴포넌트를 사용하면 UI를 재사용할 수 있는 부분으로 나누고, 각 부분을 분리하여 생각할 수 있습니다. React.Component와 React.PureComponent로 나누어 정의할 수 있습니다. ES6 class를 사용하지 않는다면, create-react-class 모듈을 대신 사용해도 됩니다. 또한 React의 컴포넌트를 정의할 때 래핑될 수 있는 함수의 형태로 할 수도 있습니다...