Django与Vue语法冲突问题完美解决方法
当我们在django web框架中,使用vue的时候,会遇到语法冲突.
因为vue使用{{}},而django也使用{{}},因此会冲突.
解决办法1:
在django1.5以后,加入了标签:
{% verbatim myblock %} {% endverbatim myblock %}
被此标签包裹的代码将不会被Django的模板引擎渲染。
因此,我们可以把带有{{ }} 的Vue代码放在 {% verbatim myblock %}标签中间(注:标签中间可放置完整html标签,例如body,div等),例如:
<div id="app1">
{% verbatim myblock %}
{{ message1 }}
{% endverbatim myblock %}
</div>
解决办法2:
修改Vue的{{ }} 为{[ ]}
<script>Vue.config.delimiters = ["{[", "]}"]</script>
使用的时候:
<div id="app1">
{[ message1 ]}
</div>
ps:vue之django 和vue语法冲突处理
修改vue.js的默认的绑定符号
vue2.0已经废弃这种写法:
Vue.config.delimiter=['[[',']]']
正确姿势:
var vm = new Vue({
delimiters:['[[', ']]'],
el:'#box',
data:{
arr:['apple','pear','grape']
},
methods:{
add:function () {
this.arr.push('tomato')
}
}
})
总结
以上所述是Django与Vue语法的冲突问题完美解决方法,希望对大家有所帮助,如果大家有任何疑问请给我留言
Django与Vue语法冲突问题完美解决方法的更多相关文章
- 如何解决Django与Vue语法的冲突
当我们在django web框架中,使用vue的时候,会遇到语法冲突.因为vue使用{{}},而django也使用{{}},因此会冲突. 解决办法1:在django1.5以后,加入了标签:{% ver ...
- (转载)Android滑动冲突的完美解决
Android滑动冲突的完美解决 作者:softwindy_brother 字体:[增加 减小] 类型:转载 时间:2017-01-24我要评论 这篇文章主要为大家详细介绍了Android滑动冲突的完 ...
- 无法解决 equal to 运算中 "Chinese_PRC_CI_AS" 和 "Chinese_PRC_90_CI_AI" 之间的排序规则冲突。的解决方法
在SQL SERVICE的查询的时候遇到了“无法解决 equal to 运算中 "Chinese_PRC_CI_AS" 和 "Chinese_PRC_90_CI_AI&q ...
- win10想说爱你不容易——安装.net3.5也是一个坑(已有完美解决方法)
最终完美解决方法:经过多次波折,终于找到无法正常安装.net3.5的原因了,是因为已删除的用户还有注册表残留导致的,而且这个问题还会影响一个win10更新的安装,导致每天更新失败,撤销更新... 详见 ...
- 关于CUDA C 项目中“ error C2059: 语法错误:“<” ”问题的解决方法
该问题的关键在于理解CUDA项目中C\C++文件需要由c++编译器进行编译,而CUDA C的源文件需要由CUDA的编译器nvcc.exe进行编译. 发生该语法错误的原因是cu文件被C++编译器所编译, ...
- PNG24在ie6下的完美解决方法!(DD_belatedPNG)
原网址:http://www.zjgsq.com/1629.html 之前写过一篇<js+css滤镜设置解决PNG24在IE6下显示问题> 解决方法不是很完美,使用起来也比较麻烦. DD_ ...
- error C2872: “flann”: 不明确的符号 --- PCL 与OpenCV2 的flann命名空间冲突问题的解决方法
error C2872: "flann": 不明确的符号 - PCL 与OpenCV2命名空间冲突问题的解决方法 error C2872: "flann" 如果 ...
- 关于vue的常识问题及解决方法
一.VSCode开发必备插件 1.Beautify:语法高亮: 2.Bracket Pair Colorizer :对括号对进行着色: 3.ESLint:ESLint插件,高亮提示: 4.HTML C ...
- [转]axios请求超时,设置重新请求的完美解决方法
自从使用Vue2之后,就使用官方推荐的axios的插件来调用API,在使用过程中,如果服务器或者网络不稳定掉包了, 你们该如何处理呢? 下面我给你们分享一下我的经历. 具体原因 最近公司在做一个项目, ...
随机推荐
- 尝试一下markdown
尝试一下markdown 简单介绍以下几个宏: __VA_ARGS__是一个可变参数的宏,这个可变参数的宏是新的C99规范中新增的,目前似乎只有gcc支持(VC6.0的编译器不支持).宏前面加上##的 ...
- NGINX 缓存使用指南
NGINX 缓存使用指南 [proxy_cache] Nginx 一个web缓存坐落于客户端和“原始服务器(origin server)”中间,它保留了所有可见内容的拷贝.如果一个客户端请求的内容在缓 ...
- node - 上传文件并且修改名称
html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF- ...
- 最新版的 react-native 降级处理
1.react-native 常见操作 (1)react-native init Demo (2)adb devices (3)react-native run-android (4)ipconfig ...
- android 通过bitmapfactory得到图片真实像素的方法,以及没有得到真实像素的原因
原文来自:原文地址 由于这个错误导致浪费非常长时间找原因,所以要赶紧记录下来. 过程是这种,在使用android读取图片的时候,就是使用BitmapFactory.decodeResource(thi ...
- MySql修改root密码、设置IP访问
先登录:mysql -h 192.168.5.116 -P 3306 -u root -p123456 首次登陆无密码命令:mysql -h 192.168.5.116 -P 3306 -u root ...
- Atitit.常见的4gl 第四代编程语言 与 dsl
Atitit.常见的4gl 第四代编程语言 与 dsl 1. 4gl dsl发展历史1 2. 4gl dsl的特点1 3. 常见的4gl 第四代编程语言 dsl2 4. 未来趋势与标准2 4.1.1 ...
- 不可忽略的apache 的 Keep Alive
转载链接:http://hi.baidu.com/jx_iben/item/d5fe91feed74495ec9f337f1 在网页开发过程中,Keep-Alive是HTTP协议中非常重要的一个属性. ...
- win10 下eclipse tomcat 热部署问题?
前言: 问题的描述: 用的环境是maven,java,tomcat,win10 tomcat server配置如下 项目发布之后,修改jsp,报错,错误详情如下: 解决办法.勾选server opti ...
- PYTHON测试邮件系统弱密码
#-*- coding:utf-8 -*- #测试公司邮件系统弱密码, from email.mime.text import MIMEText import smtplib #弱密码字典 passL ...