如何解決Django與Vue語法的衝突

當我們在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>

即可.

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章