Heim  >  Fragen und Antworten  >  Hauptteil

Rendern von HTML-Inhalten ohne Escapezeichen in Vue.js

<p>Wie analysiere ich HTML-Code in der Schnurrbartbindung? Derzeit werden Zeilenumbrüche (<code><br /></code>) nur angezeigt/escaped. </p> <p>Kleine Vue-Anwendung:</p> <pre class="brush:php;toolbar:false;">var logapp = new Vue({ el: '#logapp', Daten: { Titel: 'Protokolle', Protokolle: [ { status: true, type: 'Import', desc: 'Learn<br />JavaScript', date: '11.11.2015', id: 1 }, { Status: true, Typ: 'Import', desc: 'Learn<br />JavaScript', Datum: '11.11.2015', ID: 1 } ] } })</pre> <p>Das Folgende ist die Vorlage: </p> <pre class="brush:php;toolbar:false;"><div id="logapp"> <Tabelle> <tbody> <tr v-repeat="logs"> <td>{{fail}}</td> <td>{{type}}</td> <td>{{description}}</td> <td>{{stamp}}</td> <td>{{id}}</td> </tr> </tbody> </table> </div></pre></p>
P粉253518620P粉253518620449 Tage vor577

Antworte allen(2)Ich werde antworten

  • P粉939473759

    P粉9394737592023-08-22 17:15:45

    从Vue2开始,三个大括号被弃用了,你需要使用v-html

    <div v-html="task.html_content"> </div>

    文档链接中不清楚我们应该在v-html中放置什么,你的变量应该放在v-html中。

    此外,v-html只适用于<div><span>,而不适用于<template>

    如果你想在应用中实时查看,请点击这里

    Antwort
    0
  • P粉399090746

    P粉3990907462023-08-22 15:03:22

    您可以使用 v-html 指令来显示它。 像这样:

    <td v-html="desc"></td>
    

    Antwort
    0
  • StornierenAntwort