일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
Tags
- 화장품
- 서평
- 돈
- C
- algorithmtraining
- 투자
- 알고리즘공부
- 자바스크립트
- 프로그래밍언어
- algorithmTest
- 독후감
- 자바
- 책알남
- 주식
- 알고리즘트레이닝
- 독서
- 백준알고리즘
- 재테크
- Java
- 알고리즘 공부
- 프로그래머스 알고리즘 공부
- C++
- 채권
- 경제
- 성분
- JavaScript
- 지혜를가진흑곰
- 책을알려주는남자
- algorithmStudy
- 다독
Archives
- Today
- Total
탁월함은 어떻게 나오는가?
[React] Typescript event.taget.innerText 안될 경우에 해결 방법 본문
[Snow-ball]front/REACT 리액트
[React] Typescript event.taget.innerText 안될 경우에 해결 방법
Snow-ball 2023. 4. 25. 19:42반응형
타입스크립트 리액트로 event.target 이후로 접근이 안될 경우가 생긴다.
그 중에서 event.target.innerText 에 접근하는 방법을 공유한다.
1
2
3
4
|
const selectedDay = (e: React.MouseEvent<HTMLElement, MouseEvent>) => {
const eventTarget = e.target as HTMLElement;
console.log(eventTarget.innerText);
};
|
cs |
그 외에도 HTMLElement 속성이 존재한다면 접근이 가능하다.
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
|
interface HTMLElement extends Element, DocumentAndElementEventHandlers, ElementCSSInlineStyle, ElementContentEditable, GlobalEventHandlers, HTMLOrSVGElement {
accessKey: string;
readonly accessKeyLabel: string;
autocapitalize: string;
dir: string;
draggable: boolean;
hidden: boolean;
inert: boolean;
innerText: string;
lang: string;
readonly offsetHeight: number;
readonly offsetLeft: number;
readonly offsetParent: Element | null;
readonly offsetTop: number;
readonly offsetWidth: number;
outerText: string;
spellcheck: boolean;
title: string;
translate: boolean;
attachInternals(): ElementInternals;
click(): void;
addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
}
|
cs |
반응형
'[Snow-ball]front > REACT 리액트' 카테고리의 다른 글
[ReactNative] 리액트 네이티브 metro-bundler 서버 실행시 Whatchman error (0) | 2023.05.17 |
---|---|
REACT(리액트) Virtual DOM이란 무엇인가? (0) | 2022.09.20 |
React에서 map함수를 사용해서 jsx 동적 테이블 그리기 (0) | 2022.08.10 |
REACT(리액트) Function Component(함수 컴포넌트) VS Funtional Component(함수형 컴포넌트) - 차이점과 헷갈리는 이유 그리고 적절한 말은 무엇일까? (0) | 2022.07.21 |
[React] 리액트에서 쓸만한 차트 라이브러리 14종류 (0) | 2021.12.28 |
Comments