>  Q&A  >  본문

REST API를 통해 마크다운을 보내고 프런트엔드에서 렌더링하는 방법(React)

그래서 Markdown 파일을 변환해서 Rest API를 통해 전송한 후 프런트엔드에서 렌더링해 보았습니다. 문제는 개행 문자와 기타 내용을 다시 변환하려고 하면 손실된다는 것입니다.

원본 마크다운을 유지하는 방식으로 렌더링하는 방법은 무엇입니까?

이를 수행하는 표준 방법이 있나요?

API를 통해 전송된 json.stringify를 통해 마크다운 변환을 시도하고 다시 마크다운으로 변환을 시도했지만 더 이상 이전처럼 작동하지 않습니다.

P粉166779363P粉166779363207일 전319

모든 응답(2)나는 대답할 것이다

  • P粉418214279

    P粉4182142792024-02-27 10:52:54

    모든 것을

     tag as following

       This is 
       some code
       A json:
       {
         key: value
       }
    
    에 추가할 수 있습니다.

    <pre><pre> 태그에서 텍스트는 공백과 줄 바꿈을 유지하므로 HTML 소스 코드에 작성된 것과 똑같이 표시됩니다.

    회신하다
    0
  • P粉423694341

    P粉4236943412024-02-27 00:41:39

    원본 파일을 문자열로 보내거나, 이것이 옵션이 아닌 경우 다음 기능을 사용하여 개체의 형식을 지정할 수 있습니다.

    으으으으으으'); 함수 형식(객체) { 결과 = ""로 두십시오; ProcessObject(객체, 2); 함수 processObject(객체, 깊이, isObjectValue = false, TrailingComma = "") { if (배열 . isArray (객체)) { 결과 += `${isObjectValue ? " " : "
    " + " ".repeat(깊이 - 2)}[`; for (let i = 0; i < object.length; i++) { const 요소 = 객체[i], TrailingComma = i + 1 === object.length ? "": ","; 스위치(요소 유형) { 사례 "객체": processObject(요소, 깊이 + 2, false, TrailingComma); 나머지; 사례 "문자열": 결과 += `< object.length; i++) { const 元素 = 对象[i], TrailingComma = i + 1 === object.length ? “”:“,”; switch(元素类型){ 案例“对象”: processObject(元素, 深度 + 2, false, TrailingComma); 休息; 案例“字符串”: 结果 += `
    ${" ".repeat(깊이)}"${element}"${trailingComma}`; 나머지; 사건 번호': 결과 += `
    ${" ".repeat(깊이) + 요소}${trailingComma}`; 나머지; } } 결과 += `
    ${" ".repeat(깊이 - 2)}]${trailingComma}`; } 다른 { 결과 += `${isObjectValue ? " " : "
    " + " ".repeat(깊이 - 2)}{`; keyIndex = 0, keyCount = Object.keys(객체).length; for(객체의 키) { const 값 = 객체[키], 후행 쉼표 = ++keyIndex === keyCount ? "": ","; 스위치(값 유형){ 사례 "객체": 결과 += `
    ${" ".repeat(깊이)}"${key}":`; processObject(value, 깊이 + 2, true, TrailingComma); 나머지; 사례 "문자열": 결과 += `
    ${" ".repeat(깊이)}"${key}": "${value}"${trailingComma}`; 나머지; 사건 번호': 결과 += `
    ${" ".repeat(깊이)}"${key}": ${value}${trailingComma}`; 나머지; } } 결과 += `
    ${" ".repeat(깊이 - 2)}}${trailingComma}`; } } 결과를 반환합니다. }

    회신하다
    0
  • 취소회신하다