이번 오류는 진짜 돌고 돌고 돌아서 해결했다..ㅠㅠㅠㅠㅠ
일단 사건의 발단...
게시글 등록하는 페이지 게시글을 등록해주면 게시글 상세페이지로 이동하고..
그 서버 Param를 받아서 상세페이지에다가 뿌려주는 작업을 하고 있었다.
근데,,.타이틀과 달리 내용에 태그가 그대로 붙어서 나오는 현상이 있는 것이다.
쉽게 쉽게 가려고 이거 저거 다 해봤지만..<p>태그 외에도? 다른 태그가 붙어 나온다던지의 가능성을 생각했을때 ..
내가 생각한 해결방안은 사실 너무 돌아가는 방법이였지만, 어쨋든 다시 지름길로 돌아왔으니 삽질하면서 또 하나 배웠다고 느끼고 있습니다..
초기해결방법
let que = JSON.stringify(question.questionBody);임의 코드를 설명하자면 일단 객체를 JSON 문자열로 변환합니다.
그리하여 콘솔로 출력하니 밑에 처럼 출력이 된다.
"<p>ㅠㅠㅠ</p>"그 당시 내 생각 : 그럼 저 따옴표를 없애 주면 되겠군! ㅋㅋㅋ순조롭네!!!
그리하여 찾아낸 함수 str.replace. 사용법은 MDN 과 구글에 잘 나와있습니다.
밑에 코드 대로 한다면 양쪽 따움표를 없애준다는 것 입니다.
post = chk_array.replace(/"/g, '');그런데도!?!?
??????
이상하다. "를 제거 했는데도 html에 그대로 출력이 된다..,
그래서 한번더 구글링을 해봤더니.
<div
dangerouslySetInnerHTML={{ __html: question.questionBody,}} ></div>리액트에서 직접 해결법을 제시해주었다..저 태그를 이용해서 html태그를 안보이게 할수있다.
🎠 타란~
일부로 중간에다가 언더라인을 해봤는데 태그가 안나오는것을 확인하며 기뻐했다..그러나 잠시..후..,
(따지고보면 이 오류가 안떳다면 코드 안줄이고 끝냈을 테지..)
TypeError: Cannot read properties of undefined
다른 작업을 하고 다시 접속하니 콘솔창에 에러가 떡 하니 뜨고 화면이 사라졌다...
ㅠㅠ
바로 replace오류이다!!!
replace오류를 해결하고 다시 보니 중간에 필요없는 다리가 너무 많지 않은가..ㅋㅋㅋ
기존 : 객체변환 - > 문자열을 replace사용 따옴표 제거 -> dangerouslySetInnerHTM 사용
현재 : dangerouslySetInnerHTM 사용
ㅋㅋㅋㅋ...그저 먹혔다는 생각에 코드를 더 둘러보지 않고 넘어간 것을 반성!
