当我们在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. POJ 2352 stars (树状数组入门经典!!!)

    Stars Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 54352   Accepted: 23386 Descripti ...

  2. Blocking Master Example QT 自带 的 serial 即 串口 例子

    1.官方解释文档:http://doc.qt.io/qt-5/qtserialport-blockingmaster-example.html Blocking Master shows how to ...

  3. 搭建springboot项目

    1.搭建环境windows10+jdk1.8+eclipse4.8+maven 2.为了学习微服务架构学习搭建基础项目 3.分为两种搭建方式为maven项目和单独建立springboot项目(ecli ...

  4. Oracle 11g DataGuard搭建(一) - 单节点到单节点

    (一)DataGuard概要 DataGuard中文称为”数据卫士“,提供了数据库高可用性.数据保护和灾难恢复的功能.DataGuard通过建立primary数据库和standby数据库来确立参照关系 ...

  5. [iOS]被忽略的main函数

    如同任何基于C的应用程序,程序启动的主入口点为iOS应用程序的main函数.在iOS应用程序,main函数的作用是很少的.它的主要工作是控制UIKit framework.因此,你在Xcode中创建任 ...

  6. Python3中正则模块re.compile、re.match及re.search函数用法详解

    Python3中正则模块re.compile.re.match及re.search函数用法 re模块 re.compile.re.match. re.search 正则匹配的时候,第一个字符是 r,表 ...

  7. Ubuntu16.04安装TensorFlow

    1.查看tensoflow与CUDA对应版本: windows端:https://tensorflow.google.cn/install/source_windows Linux端:https:// ...

  8. linux学习笔记三:防火墙设置

    请注意:centOS7和7之前的版本在防火墙设置上不同,只有正确的设置防火墙才能实现window下访问linux中的web应用. centOS6添加端口: vi /ets/sysconfig/ipta ...

  9. php的mysqli_connect函数显示 No such file or directory错误以及localhost换成127.0.0.1执行成功

    Centos7环境-php7-MariaDB5.5.60 (新安装的php7,执行php -m 显示有mysqli模块,php.ini没有改其它) 测试代码为: <?php //~ echo d ...

  10. jqGrid 分页

    这两天一直在搞jqGrid分页,焦头烂额,不过还是有点收获的(主要是后台分页):   jqGrid分页可以分为两种,远程数据(服务器数据)分页和本地数据分页,     先看远程数据分页:   $(&q ...