Django与Vue语法的冲突问题完美解决方法
2017-12-14 14:11
1096 查看
当我们在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>
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语法的冲突问题完美解决方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!
您可能感兴趣的文章:
相关文章推荐
- SpringBoot+Vue前后端分离,使用SpringSecurity完美处理权限问题的解决方法
- onMeasure简单方法 完美解决ListView与ScollView冲突问题!
- 因为与关键字冲突而导致的"update语句的语法错误"问题解决方法
- 完美解决Android里面scrollview嵌套及listview嵌套viewpager的滑动冲突问题的简单方法
- 如何解决Django与Vue语法的冲突
- 如何解决Django与Vue语法的冲突
- onMeasure简单方法 完美解决ListView与ScollView冲突问题!
- 解决自定义$(id)的方法与jquery选择器冲突的问题
- Vista/Win 7安装程序冲突问题的解决方法
- 金山词霸与卡巴冲突问题解决方法
- linux 下同名符号冲突问题解决方法
- 配置android时出现path问题,因为路径有中文,完美解决方法
- IP地址冲突问题的解决方法
- “完美”解决使用Dr.com与GNS3冲突问题
- IP地址冲突问题的解决方法
- Linux下MAC地址冲突的问题解决方法
- Android Vold和SDIO冲突问题解决方法
- asp.net开发与web标准的冲突问题的一些常见解决方法
- ogre 1.6和mfc 的debug new冲突问题的白痴解决方法。。
- python django学习-问题记录及解决方法