레거시한 프로젝트를 진행하다보면 window에 박혀있는 함수나 변수라던지
그냥 쌩 객체에다가 글로벌 변수로 만들어서 사용하는 경우가 있다.

ex)

var window.isEnable;
manualObj = {
	variable1: "1",
    variable2: "2",
}
....

• 이런경우는 리렌더링이 되질 않는다.
  참고로 의도적으로 리렌더링을 방지하는 변수를 사용하고싶다면 createRef, useRef를 변수로 사용하면된다.
  쌩 객체는....

forceRerender

• 여하튼 본론으로 들어와서 위와같은 상황에서 리렌더링을 하고싶다면 객체를 변화 시킨다음 강제로 리렌더링을 시켜주면 된다.

코드로 대화합시다

// # 오늘의 타겟 
// global한 성격의 윈도우객체에 지성없이 isEnabled를 우겨넣어 사용하고 싶고
// 또한 해당 값이 변경됐을때 rerendering을 하고싶다.
window.isEnabled;

// 강제로 리렌더링 하기위해 foreceRerender를 state에 박는다.
this.state = {
	forceRerender: false,
    ...
    ...
}

// 객체를 먼저 변환한다음 (이때는 리렌더링 되지 않음)
// forceRerender를 작동시켜 이 컴포넌트의 로직에 전혀 영향을 주지 않으면서 리렌더링이 일어난다.
<button 
	onClick={()=>{
		window.isEnabled = !(!!window.isEnabled);
      	this.setState((prevState: any) => ({ forceRerender: !prevState }))
		console.log("window: ",window)
	}}
>
	forceRerender : {String(this.state.forceRerender)}
</button>

봐보면 정말 너무나 당연한 내용이다.
단지 리렌더링이 된다는 이유만으로 무엇인가 사이드 이펙트가 일어나면 해당 로직은 얼른 수정해주자.
안되면 또 어케든 되게하면 그만