当我们在django web框架中,使用vue的时候,会遇到语法冲突.
因为vue使用{{}},而django也使用{{}},因此会冲突.

解决办法1:
在django1.5以后,加入了标签:
{% verbatim myblock %} {% endverbatim myblock %}
被此标签包裹的代码将不会被Django的模板引擎渲染。
因此,我们可以把带有{{ }} 的Vue代码放在 {% verbatim myblock %}标签中间,例如:

<div id="app1">
{% verbatim myblock %}
{{ message1 }}
{% endverbatim myblock %}
</div>
解决办法2:
修改Vue的{{ }} 为{[ ]}

<script>Vue.config.delimiters = ["{[", "]}"]</script>
使用的时候:

<div id="app1">
{[ message1 ]}
</div>
即可。

如何解决Django与Vue语法的冲突

如何解决Django与Vue语法的冲突的更多相关文章

  1. Django与Vue语法冲突问题完美解决方法

    当我们在django web框架中,使用vue的时候,会遇到语法冲突. 因为vue使用{{}},而django也使用{{}},因此会冲突. 解决办法1: 在django1.5以后,加入了标签: {% ...

  2. 解决webstorm中vue语法没有提示

    首先看看webstrom内置的vue插件,打上勾,没有这个选项就要自己去下载插件了 如果插件还是没有语法提示,可以用下面的方法,自己添加语法进去搜索 unknown HTML tag attribut ...

  3. python - django 解决 templates 模板语言语法冲突

    # 在使用某个框架时发现语法与Django的模板语法冲突了,于是找到解决方案: {% verbatim %} // 被 verbatim 包裹起来的地方是不会被 django 渲染的 {% endve ...

  4. 解决Django+Vue前后端分离的跨域问题及关闭csrf验证

      前后端分离难免要接触到跨域问题,跨域的相关知识请参:跨域问题,解决之道   在Django和Vue前后端分离的时候也会遇到跨域的问题,因为刚刚接触Django还不太了解,今天花了好长的时间,查阅了 ...

  5. tornado和vue的模板冲突解决方法

    tornado和vue的模板冲突解决方法 Vue的插值表达式和tornado的模板都为一对花括号,可以通过修改vue的插值表达式的符号来解决这个问题,具体方法如下: var vm = new Vue( ...

  6. 解决distinct与order by 的冲突

    sql="select distinct id from test order by otherfield desc" 需要找到不同的id,同时又想让记录按fbsj排序.但是这样一 ...

  7. django rest_framework vue 实现用户登录

    django rest_framework vue 实现用户登录 后端代码就不介绍了,可以参考  django rest_framework 实现用户登录认证 这里介绍一下前端代码,和前后端的联调过程 ...

  8. 解决phpStorm使用vue提示"Attribute v-xxx is not allowed here"的问题

    jetbrains家族的新版webStorm.phpStorm等工具都已支持vue,不需要自己再安装Vue.js插件,对vue单文件组件支持挺好.但是在html文件中直接<script>引 ...

  9. 2. Vue语法--插值操作&动态绑定属性 详解

    目录 1. 设置vue模板 2. vue语法--插值操作 3. 动态绑定属性--v-bind 一. 设置vue模板 我们经常新建一个vue项目的时候, 会写如下的一段代码 <!DOCTYPE h ...

随机推荐

  1. [转]MVP+WCF+三层结构搭建项目框架

    最近,我一直在重构之前做的一个项目,在这个过程中感慨万千.原先的项目是一个运用了WCF的C/S系统,在客户端运用了MVC模式,但MVC的View.Model耦合以及WCF端分布式欠佳等问题让我有了重构 ...

  2. yii2数据库简单操作

    1.简单查询: one(): 根据查询结果返回查询的第一条记录. all(): 根据查询结果返回所有记录. count(): 返回记录的数量. sum(): 返回指定列的总数. average():  ...

  3. 所有流媒体协议,编解码规范和媒体封装格式的datasheet的下载地址

    https://github.com/jiayayao/DataSheet All datasheet about stream protocol, encode-decode spec and me ...

  4. 12c数据库重启后自动启动pdb

    由于最近管理12c数据库,创建了9个新的pdb.相对于以前11g版本每天一个一个的环境检查,方便了很多. 但是因为一次意外宕机,数据库重启.虽然数据库重启,但是管理的pdb确不能自动重启,所以需要手动 ...

  5. JS与OC交互,JS中调用OC方法(获取JSContext的方式)

    最近用到JS和OC原生方法调用的问题,查了许多资料都语焉不详,自己记录一下吧,如果有误欢迎联系我指出. JS中调用OC方法有三种方式: 1.通过获取JSContext的方式直接调用OC方法 2.通过继 ...

  6. XIB

    Xib加载的几种方法 - 简书 一天一点xib_10说说原理.优化方面的东西吧 - 简书 自定义View的封装和xib文件的使用详解|xiaoyou's blog 纯代码封装自定义View和XIB封装 ...

  7. webStorm安装以及集成git使用!

    一:安装webstorm 百度网盘地址:https://pan.baidu.com/s/1K96mg7WYHc6X3odtk7_f2g 密码:2cgd   二:破解webstorm 1:选择liste ...

  8. 第三月 day03.笔记

    函数在调用的时候回形成一个私有作用域,内部变量不会被外面访问,这种保护机制叫做闭包,这就意味着函数调用完了,这个函数形成的栈内存就会被销毁,但有时候我们不希望被销毁. * 函数归属谁和他的调用没有关系 ...

  9. windows7平台 nginx+python 环境搭建

    参考了这篇文章,感谢原文作者:https://blog.csdn.net/foxgod/article/details/78929201 最近正在学习Python,发现除了写一点py脚本在idlex上 ...

  10. 1.Hadoop集群安装部署

    Hadoop集群安装部署 1.介绍 (1)架构模型 (2)使用工具 VMWARE cenos7 Xshell Xftp jdk-8u91-linux-x64.rpm hadoop-2.7.3.tar. ...