v-html ne peut pas être rendu dans Vue\r\n\t

Question

J'ai des données comme ceci :

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>"
}

Sur la base des données, je souhaite les afficher en utilisant Vue js.

Voici mon code Vue js :

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

Si vous exécutez le code ci-dessus, le résultat sera comme ceci :

Comme vous pouvez le voir, rn et t ne semblent pas être rendus par Vue js

Comment laisser r n et t être rendus par Vue js et affichés comme suit ?

Answer 1

r、n 和 t 不是有效的 HTML；它们是在其他语言中使用的转义序列（因此期望它们在 HTML 中工作就像将 python 代码粘贴到 javascript 文件中并期望它运行一样。）您需要将它们替换为 HTML做你想让它做的事。对于新行，可以使用 <br> 标签，但传统上人们通过将其部分包装在段落 (<p>) 或 div (<div>) pour gérer les nouvelles lignes. Pour les onglets, vous devrez rechercher sur Google comment gérer l'indentation en HTML, car il y a beaucoup de choses à ce sujet que je ne peux pas expliquer dans une réponse courte ici.