在Django與Vue語法中存在衝突問題如何解決

這篇文章主要介紹了Django與Vue語法的衝突問題完美解決方法，本文給大家分享了兩種解決方法，需要的朋友參考下吧

當我們在django web框架中,使用vue的時候,會遇到語法衝突.

因為vue使用{{}},而django也使用{{}},因此會衝突.

解決方法1:

在django1.5以後,加入了標籤:

{% verbatim myblock %} {% endverbatim myblock %}

被此標籤包裹的程式碼將不會被Django的模板引擎渲染。

因此,我們可以把帶有{{ }} 的Vue程式碼放在{% verbatim myblock %}標籤中間,例如:

<p id="app1">
  {% verbatim myblock %}
    {{ message1 }}
  {% endverbatim myblock %}
</p>

##解決方案2:

修改Vue的{{ }} 為{[ ]}

<script>Vue.config.delimiters = ["{[", "]}"]</script>

使用的時候:

<p id="app1">
  {[ message1 ]}
</p>

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')
    }
  }
})

上面是我整理給大家的，希望今後會對大家有幫助。

相關文章：

在vue中如何使用cdn最佳化

在js中如何實作判斷檔案類型大小

在js中如何實作登入需要滑動驗證

在Angular中如何實作下拉方塊模糊查詢功能

在Nodejs中有關crypto模組安全知識（詳細教學）

在angularjs中如何實作分頁和搜尋功能

以上是在Django與Vue語法中存在衝突問題如何解決的詳細內容。更多資訊請關注PHP中文網其他相關文章！