400字日记,黄色小游戏,娜德雅·苏尔曼
当我们在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语法的冲突问题完美解决方法,希望对大家有所帮助
如对本文有疑问,请在下面进行留言讨论,广大热心网友会与你互动!! 点击进行留言回复
VUE+elementui组件在table-cell单元格中绘制微型echarts图
Vue通过getAction的finally来最大程度避免影响主数据呈现问题
vue 路由懒加载中给 Webpack Chunks 命名的方法
网友评论