리액트 processUpdates(): Unable to find child

아직 많은 경험이 부족한 탓에 구글링을 열심히 하면서 에러를 해결해 나가고 있는중이다..

 

리액트는 엄격한 웹표준을 따르는거 같다.. (아니면 알고리즘을 그렇게 짜놓았는지는 모르겠지만)

 

우선 저는 최초 ajax로 서버에서 값을 json으로 받아서 값을 output 후 사용자가 검색 버튼을 클릭 시

 

다시 ajax로  리스트 데이터를 변경 시키는 작업에 있었습니다.

 

그런데 예상치도 못한 processUpdates(): Unable to find child  에러가 발생한것!!

최초 이상없이 ouput을 하였는데도 불구하고 값을 변경하면 저런 에러가 발생을 하는게 이해가 안갔다..

 

그래서 반나절동안 구글링한 결과 해답을 찾았다...

 

<!-- JSP -->

 

<table>

<tr>

<td>제목1</td>

<td>제목2</td>

</tr>

<%

for(int i = 0; i < 10; i++) {

%>

<tr>

<td>불라1</td>

<td>불라2</td>

</tr>

<%}%>

</table>

 

이렇게 사용을 하는데( 위에서 말하던 ajax사용하는 부분은 아닙니다)

리액트 에서는

이상하게 <table>태그로 감싸서 만들지 않으면 에러가 발생을 한다...

다음과 같이 해결함

 

<!-- 리액트 -->

 

dataList (data) {

return data.map(function(data, index){

return(

<table key={i}>

<tr>

<td>{data.컬럼}</td>

</tr>

</table>

);

});

}

render() {

return(

<table>

<tr>

<td>제목1</td>

<td>제목2</td>

</tr>

</table>

{dataList(this.state.불라불라)}

);

 

}

 

 

윗부분이 정답은 아닐것입니다. 하지만 혹시라도 위 방법 말고 다른 해결 방안을 아신다면 댓글로 제시해주시면 감사하겠습니다.

추가적으로 왜 이러한 에러가 발생하는지 명확하게 알게되면 게시글을 수정하도록 해서 공유하도록 하겠습니다 .