리액트 file upload button 먹통 문제 해결

https://stackoverflow.com/questions/40589302/how-to-enable-file-upload-on-reacts-material-ui-simple-input How to enable file upload on React’s Material UI simple input?

Material-UI + React 로 사용한 버튼 중에서 파일 업로드를 위한 버튼은 좀 특이하다. 버튼인데 OnClick을 정의하지 않고 사용하기 때문이다. 그 대신, input children으로 클릭을 받아서, 업로드에 필요한 파일을 가져올 수 있다. 사용 예시는 다음과 같다. 기존 코드가 label하고 이것 저것 섞어놨었는데 자꾸 먹통이 되어서 (50% 확률로 동작을 안함 ㅋㅋ) 자료를 검색하여 정리해둔다.

                                <Button
                                    variant="contained"
                                    component="label"
                                    className={buttonStyle.secondary_button}
                                >
                                    <Typography
                                        className={textStyle.primary_15_bold}>
                                        {"변경"}</Typography>

                                    <input id={"file-input"} style={{ display: 'none' }} type="file" name="imageFile"
                                        onChange={handleChangeImage} />

                                </Button>