<dd id="3pk9i"><optgroup id="3pk9i"><video id="3pk9i"></video></optgroup></dd>
<rp id="3pk9i"></rp>

<dd id="3pk9i"><track id="3pk9i"></track></dd>
      1. <th id="3pk9i"></th>
        1. <ol id="3pk9i"><ruby id="3pk9i"></ruby></ol>

        2. react標簽不換行怎么辦-全球觀速訊

          來源:php中文網 | 2022-12-29 10:59:09 |


          【資料圖】

          本教程操作環境:Windows10系統、react18.0.0版、Dell G3電腦。

          react標簽不換行怎么辦?

          React項目/JSX中‘\n’不換行問題解決

          最近在React項目中,后端返回的字符串中用\n提供給前端進行換行,但是在前端頁面并沒用實現換行,我在網上查了很多資料,找到很多方法,但是都沒有實現換行,最后,我自己無意間通過組合試出來了。

          1 首先,對返回的數據中的\n進行處理,用<br/>替換

          eg:const info = "React\n Vue\n Angular";const replaceInfo = info.replace(/\\n/g, "<br/>);

          2 在JSX中,配合dangerousSetInnerHTML實現換行,設置css屬性:white-space:pre-wrap

          eg:<div style={{whiteSpace: "pre-wrap"}} dangerousSetInnerHTML={{__html: replaceInfo}}>

          推薦學習:《react視頻教程》

          以上就是react標簽不換行怎么辦的詳細內容,更多請關注php中文網其它相關文章!

          關鍵詞: React

          中文字幕在线观看2021
          <dd id="3pk9i"><optgroup id="3pk9i"><video id="3pk9i"></video></optgroup></dd>
          <rp id="3pk9i"></rp>

          <dd id="3pk9i"><track id="3pk9i"></track></dd>
            1. <th id="3pk9i"></th>
              1. <ol id="3pk9i"><ruby id="3pk9i"></ruby></ol>