當我們在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已經(jīng)廢棄這種寫法:

Vue.config.delimiter=['[[',']]'];

正確姿勢:

var vm = new Vue({  delimiters:['[[', ']]'],  el:'#box',  data:{    arr:['apple','pear','grape']  },  methods:{    add:function () {      this.arr.push('tomato')    }  }})

總結(jié)

以上所述是小編給大家介紹的Django與Vue語法的沖突問題完美解決方法，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對錯新站長站網(wǎng)站的支持！