[Error Note] Warning: Received false for a non-boolean attribute showmsg. If you want to write it to the DOM, pass a string instead: showmsg="false" or showmsg={value.toString()}. If you used to conditionally omit it with showmsg={condition && value}, p..

React로 MUI UI 툴을 활용하여 Front 단 웹 페이지를 개발하던 중 

'Warning: Received false for a non-boolean attribute showmsg. If you want to write it to the DOM, pass a string instead: showmsg="false" or showmsg={value.toString()}. If you used to conditionally omit it with showmsg={condition && value}, pass showmsg={condition ? value : undefined} instead.'

해당 Error를 볼 수 있었다.

내가 작성한 코드는 다음과 같다.

<form show={this.state.show} handleclose={this.hideModal}>
</form>

해결한 코드 내용

<Box showmsg={showmsg.toString()}>
</Box>

error message를 보면 'showmsg={condition && value}'이나 '{condition ? value : undefined}'처럼 계속된 condition의 언급으로 인해서 condition에 대해서 서칭을 해봤는데 도저히 관련된 해결방안을 찾지 못했다.

 

showmsg는 uesState로 선언한 값이고, boolean 값으로 true/false로만 설정할 수 있어서 데이터 속성을 변경해서 해결할 생각을 하지 못했는데, 
결론은 toString()을 활용하여 boolean 값을 문자열로 변환해서 데이터 속성을 바꿔주는 것이 답이다..!

 

 

참고 - <https://stackoverflow.com/questions/59634711/warning-received-false-for-a-non-boolean-attribute-show-how-do-i-pass-a-bo>