django 渲染模板与 vue 的 {{ }} 冲突解决方法

时间:2024-07-14 17:35:26

如果不可避免的在同一个页面里既有 django 渲染又有 vue 渲染的部分,可有 2 种方式解决

方法一:

  采用 vue 的 delimiters  分隔符。

new Vue({
delimiters: ["{[", "]}"] // 可自定义符号
})

方法二:

建议把 vue 的部分用 {% verbatim %} 包起来。

见文档:https://docs.djangoproject.com/en/2.2/ref/templates/builtins/#verbatim

{% verbatim %}
<div>{{ text }}</div>
{% endverbatim %}