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

 

如果不可避免的在同一个页面里既有 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 %}