Смешивание синтаксиса двух шаблонизаторов

#javascript #python #django #vuejs #шаблоны

Появилась такая проблема, есть Django приложение. Частично хотел начать переписывать
фронт на Vue, но встала проблема одинакового синтаксиса шаблонизаторов. {{ value }}
используется в обоих фреймворках и вроде бы я где-то находил решение подобной проблемы,
но к сожалению повторно найти не смог. Vue на первое время тянется из CDN, поэтому
делать SPA пока не вариант.
    

Ответы

Ответ 1

Кажется наиболее удобный способ - все Vue-шаблоны заключить в Django-теги: verbatim:

{% verbatim %}
{{header}}
{% endverbatim %}


Весь код внутри verbatim будет вставлен в результирующий html "как есть". Далее на
стороне браузера Vue спокойно продолжит с ним работать


Ответ 2

Есть два способа решить эту проблему.


На стороне Django: Использовать в шаблонах вместо {{ some_varibale }} монструозную
конструкцию {% templatetag openvariable %} some_varibale {% templatetag closevariable %}
На стороне Vue: Переопределить разделители

var app = Vue({
    el: '#app',
    delimiters: ['[[', ']]']
});