Next.js 제목 경고 문제

title 지정 후 Next.js 에서 아래와 같이 경고하였다.

A title element received an array with more than 1 element as children. In browsers title Elements can only have Text Nodes as children. If the children being rendered output more than a single text node in aggregate the browser will display markup and comments as text in the title and hydration will likely fail and fall back to client rendering

원인

현재 타이틀은 변수를 받는 값 1개 , 분양모음집 이라는 텍스트 1개 이렇게 2개로 나누어져 있었다.

title태그가  하나의 텍스트만 받을 수 있다고 하니  이것이 경고의 원인으로 보인다 .

해결책

children 경고로 1개 이상의 요소가 포함된 배열에 대한 해결책은  템플릿리터럴 로 감싸주는 것이다(백틱 사용).

아래와 같이 코드를 변경하였다.

경고가 발생하지 않는다.