Vue中v-html無法渲染\r\n\t

Question

我有這樣的數據：

data: {
  content:"<p><span style="font-size:16px">Berikut adalah beberapa pemberontakan yang pernah terjadi di daerah.</span></p>rnrn<p><span style="font-size:16px"><strong>1. Pemberontakan Angkatan Perang Ratu Adil (APRA) </strong></span></p>rnrn<ul>rnt<li><span style="font-size:16px">di Bandung, pada 23 Januari 1950.</span></li>"
}

根據數據，我想使用 Vue js 顯示它。

這是我的 Vue js 程式碼：

<div class="row px-3" v-html="data.content"></div>

如果執行上面的程式碼，結果是這樣的：

可以看到，rn和t似乎沒有被Vue js渲染

如何讓r n和t被Vue js渲染並顯示如下？

Answer 1

\r、\n 和\t 不是有效的HTML；它們是在其他語言中使用的轉義序列（因此期望它們在HTML 中工作就像將python 程式碼貼到javascript 檔案中並期望它運行一樣。）您需要將它們替換為HTML做您想讓它做的事。對於新行，可以使用<br> 標籤，但傳統上人們透過將其部分包裝在段落(<p>) 或div (<div&gt ;) 中來處理換行符。對於選項卡，您需要在 google 上搜尋如何處理 HTML 中的縮進，因為關於它的內容有很多，我無法在此處的簡短答案中解釋。