Warning: A component is changing an uncontrolled input of type undefined to be controlled. Input elements should not switch from uncontrolled to controlled (or vice versa). Decide between using a controlled or uncontrolled input element for the lifetime of the component.

 

인풋창을 입력하는 순간 이런 에러가 뜨더라.. input value 로 undefined 가 들어가서 그런듯하다

 

const [ip, setip] = useState();
<input onChange={setip} value={ip} />

대략 내 상황..

 

const [ip, setip] = useState(''); // 해결방안 1 : 초기값을 '' 로 
<input onChange={setip} value={ip || ''} />  <!-- 해결방안 2 : 값이 undefined 일경우 value 를 ''로 --!>

 

이렇게 해결

이미 리액트 프로젝트, 리포지토리가 있다는 가정하에 진행한다.

 

gh-pages 를 설치한다

npm install gh-pages --save-dev

 

package.json 파일에

"homepage" 를 추가한다

http://[사용자 ID].github.io/[리포지토리 이름]  
//package.json 

//....
  "homepage": "https://mika0203.github.io/Pathfinding-Algorithm-js/"

 

package.json 파일에 script 부분에 predeploy, deploy 를 추가한다

 

// package.json

"scripts": {
  //...
  "predeploy": "npm run build",
  "deploy": "gh-pages -d build"
}

 

저장하고,

npm run deploy

 

 

 

이제 github로 가보자

 

 

제일 아래로

 

누른 후 세이브하고 위에서 homepage 에 입력한 주소로 들어가면 

 

해당 주소에서 실행되는 나의 리액트 프로젝트를 확인할 수 있다.

'Frontend > React' 카테고리의 다른 글

[Nextjs] useEffect 가 2번 실행되는 문제  (6) 2022.06.07
[React] input 입력 시 콘솔 에러  (13) 2021.01.19

canvas 를 사용중인데 그리기용 캔버스랑 보여주기용 캔버스 2개를 겹쳐서 사용하고 있었다.

그래서 그리기용 캔버스가 앞에 있어야 마우스 클릭이 돼서 그릴 수 있었는데 그러다보니 

보여주기 캔버스가 그리기용 그림에 덮여버리는 현상이 있었다. js 코드를 어떻게 바꾸면 되긴 되겠지만.. 귀찮아서

다른 방법을 찾아봤다.

 

<canvas id="realtimeCanvas" style="position: absolute;"></canvas>
<canvas id="canvas" style="position: absolute;"></canvas>

canvas 가 클릭, 그리기용 이었고, realtimeCanvas 가 실시간으로 계속 변경되는 캔버스였다.

 

 

그런데 realtimeCanvas 가 자꾸 뒤에 그려지다 보니 

<canvas id="canvas" style="position: absolute;"></canvas>
<canvas id="realtimeCanvas" style="position: absolute;"></canvas>

순서를 바꾸니깐 canvas 에 걸어둔 클릭 이벤트가 안되더라..

 

 

그래서 찾은게

pointer-events: none;

 

CSS 에 적어도 좋고

 

 

<canvas id="canvas" style="position: absolute;"></canvas>
<canvas id="realtimeCanvas" style="pointer-events: none; position: absolute;"></canvas>

나는 캔버스 쪽은 그냥 간단하게 이렇게 적었다.

'Frontend > HTML' 카테고리의 다른 글

[HTML] html tag에 데이터 저장  (14) 2020.04.23

버전 코드가 00인 APK를 사용하는 사용자는 android.permission.CHANGE_WIFI_MULTICAST_STATE 권한을 수락해야 할 수도 있습니다. 이로 인해 사용자가 이 버전의 앱으로 업그레이드하지 않을 수도 있습니다.
도움말:
새 권한이 반드시 필요한지 확인하고 이번 버전의 새로운 기능 텍스트에 이러한 권한을 언급하는 것을 고려해 보세요.

 

유니티 2018 버전으로 빌드하던 앱을 2019 버전으로 업그레이드 하고

구글 플레이에 업로드 하려니 이런 경고가 뜨더라. 업로드 자체는 문제없이 됐는데 그래도 경고가 뜨니깐 뭐가 문제인지, 해결방법을 찾아봤다.

 

문제는 유니티 패키지 매니저에 설치된 Multiplayer HLAPI. 유니티 2019 버전으로 업그레이드 하면서 같이 깔려서 임포트 된 듯하다. 제거해보자.

 

1. Unity -> Window -> Package Manager 로 들어간다

Unity -> Window -> Package Manager

 

2. Multiplayer HLAPI -> Remove 로 제거한다.

패키지가 너무 많아서 안보이면 왼쪽 위에 All packages 로 돼있을텐데 In Project 로 변경하거나

오른쪽 위에서 검색하도록 하자

Multiplayer HLAPI -> Remove

 

 

Reference : https://forum.unity.com/threads/change_wifi_multicast_state.667441/

'Frontend > Unity' 카테고리의 다른 글

[Unity] 안드로이드 빌드를 위한 NDK 19.0.5 버전 다운  (10) 2020.05.06

Unity 2018버전을 쓰다가 2019로 업그레이드 하고 안드로이드 IL2CPP 빌드를 하려는데

jdk, sdk, ndk 경로가 다 초기화돼서 에러가 뜨길래 다시 지정해줬다. 

 경로 지정 => Edit -> Preferences -> External

 

jdk랑 sdk 는 이전 버전에서 쓰던거 그대로 사용하니깐 잘 됐는데 ndk 는 필요한 버전이 달라져서 경로 지정이 안된다.

 

안드로이드 개발자 홈페이지가서 NDK 최신이 20 버전이고,

19 버전중 19.2 버전인가? 있길래 다운받아봤는데 안되더라...

 

ndk ver

유니티에서 원하는 버전을 정확하게 넣어줘야 하는 모양이다.

 

Windows 64 bit => https://dl.google.com/android/repository/android-ndk-r19-windows-x86_64.zip

+ Recent posts