TroubleShooting 4

[React] hover effect 이벤트함수가 child element에 제대로 적용이 안 될 때 해결방법

💢 onMouseOver 이벤트가 child element에는 적용 안 되고 parent element에만 적용될 때 ▪에러내용 : 마우스 커서를 메뉴버튼 위에 올렸을 때 버튼이 회색으로 바뀌고, 커서를 떼면 원래 색으로 돌아오도록 이벤트함수를 만들었다. 잘 작동하는 듯 했는데, 자세히 보니까 메뉴버튼에 위치한 svg 아이콘 위에 마우스를 올리면 색이 제대로 안 바뀌는 현상이 발생했다. 메뉴 component 안에 child로 아이콘을 넣어놨으니까, child element에는 parent에 적용된 이벤트함수가 제대로 적용이 안 되는 문제라고 생각하고 해결방법을 찾아봤다. ▪원인 : e.target 사용 ▪해결방법: e.currentTarget 사용 function MouseOverUserMenu(e) ..

Devlog/Web 2021.10.11

[React] MacOS onKeyDown 이벤트 시 한글 깨짐 문제 해결방법

💢 맥에서 한글로 text input 입력 후 이벤트를 trigger했을 때 단어가 제대로 인식이 안 되고 깨지는 문제 ▪에러내용 : 세 명의 팀원 중 두 명은 윈도우 환경에서 개발 중이고, 한 명은 맥북을 쓰고 있다. input란에 키워드를 입력하고 enter키를 누르면 키워드태그가 생성되는 기능을 구현했는데 이상한 문제가 발생했다. 윈도우를 쓰는 사람들 기준에서는 아무 문제 없이 태그가 정상적으로 등록됐는데, 똑같은 코드인데도 불구하고 이상하게 맥북에서는 기능이 정상적으로 수행이 안 되는 것이다. 예를 들어 사과, 토마토, 복숭아를 입력한다고 치면 윈도우에서는 위의 gif처럼 키워드 태그 3개가 각각 예쁘게 잘 생성됐는데, 맥북에서는 '사과', '과', '토마토', '토', '복숭아', '아' 이렇게..

Devlog/Web 2021.08.04

[React] 이미지파일 import 실패 에러 해결방법

💢 이미지파일 import 실패 ▪에러내용 : png react Module parse failed: Unexpected character (1:0) ▪원인 : 이미지파일 loader 부재 ▪해결방법: 1. install file-loader $ npm install file-loader --save-dev 2. add loader to webpack.config.js module.exports = { module: { rules: [ { test: /\.(png|jpe?g|gif)$/i, use: [ { loader: 'file-loader', }, ], }, ], }, }; 1, 2를 차례대로 수행한 후에 이미지파일을 다시 import 해보면 문제없이 잘 컴파일된다. 참고자료 https://v4.we..

Devlog/Web 2021.08.04

[Android] Emulator 문제 해결방법

- layout을 변경했는데 emulator(혹은 physical device)에 적용이 안 될 때 Build → Clean Project 후 Rebuild Project - 핸드폰(physical device)에 직접 돌려보려고 하는데 에러가 뜨면서 빌드가 안 될 때 Unable to determine application id: com.android.tools.idea.run.ApkProvisionException: Error loading build artifacts from: C:\Users\...\AndroidStudioProjects\Makneya_Backup\app\build\outputs\apk\debug\output-metadata.json INSTALL_FAILED_NO_MATCHING..

Devlog/Android 2021.06.29
반응형