So lösen Sie den Konflikt zwischen Django- und Vue-Syntax

Dieser Artikel stellt hauptsächlich die perfekte Lösung für den Syntaxkonflikt zwischen Django und Vue vor. Dieser Artikel teilt Ihnen zwei Lösungen mit. Freunde in Not können darauf verweisen.

Wenn wir uns im Django-Web-Framework befinden Bei Verwendung von Vue treten Syntaxkonflikte auf.

Da Vue {{}} und Django auch {{}} verwendet, kommt es zu Konflikten.

Lösung 1 :

Nach Django 1.5 wird das Tag:

{% verbatim myblock %} {% endverbatim myblock %}

Der von diesem Tag umschlossene Code wird nicht von der Template-Engine von Django gerendert.

Daher können wir den Vue-Code mit {{ }} in die Mitte des {% verbatim myblock %}-Tags einfügen, zum Beispiel:

<p id="app1">
  {% verbatim myblock %}
    {{ message1 }}
  {% endverbatim myblock %}
</p>

Lösung 2 :

Vues {{ }} in {[ ] ändern

<script>Vue.config.delimiters = ["{[", "]}"]</script>

Bei Verwendung:

<p id="app1">
  {[ message1 ]}
</p>

ps: Handhabung Syntaxkonflikte zwischen Django und Vue in Vue

Ändern Sie das Standardbindungssymbol von vue.js

vue2.0 hat diese Schreibmethode aufgegeben:

Vue.config.delimiter=['[[',']]'];

Korrekte Haltung:

var vm = new Vue({
  delimiters:['[[', ']]'],
  el:'#box',
  data:{
    arr:['apple','pear','grape']
  },
  methods:{
    add:function () {
      this.arr.push('tomato')
    }
  }
})

Das oben Gesagte habe ich für alle zusammengestellt. Ich hoffe, dass es in Zukunft für alle hilfreich sein wird.

Verwandte Artikel:

So verwenden Sie die CDN-Optimierung in Vue

So bestimmen Sie die Dateitypgröße in js

So implementieren Sie die für die Anmeldung in js erforderliche gleitende Überprüfung

So implementieren Sie die Fuzzy-Abfragefunktion des Dropdown-Felds in Angular

Informationen zur Sicherheit von Kryptomodulen in Nodejs (ausführliches Tutorial)

So implementieren Sie Paging- und Suchfunktionen in AngularJS

Das obige ist der detaillierte Inhalt vonSo lösen Sie den Konflikt zwischen Django- und Vue-Syntax. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!