djangoでVue.jsを使う方法【デミリタの変更】

vue.jsをDjangoと使う方法として、
2パターンあると思いますが、

  1. DjangoのTemplateを使いつつ一部に動的部分だけvueを埋め込む
  2. サーバー側とアプリ側つまり、DjangoはAPIサーバーとして、vueはアプリケーションサーバー側から提供して完全に分離する方法

2の場合はDjango関係ないので、
1の場合の話になります。

その時の注意点です。

Djangoのテンプレートでは、
{{message}}みたいな感じのデミリタを使うのですが、
vue.jsも同じデミリタを使うので、それを変更する必要があります、それ以外は同じです。

デミリタの変更方法

<script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
<div id="app">
  [[ message ]]
</div>
<script>
  var app = new Vue({
      el: '#app',
      delimiters: ['[[', ']]'],
      data: {
        message: 'Hello Vue!'
      }
  });
</script>

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です