DjangoテンプレートでJSに値を渡す

個人的なメモ

view.py

def index(request):
  context = {
    'data': 'a',
    'data_array': ['b', 'c', 'd'],
    'data_dict': {'key': 'e'}
  }
  return render(request, 'index.html', context)

index.html

<script>
  const data = "{{ data }}";
  const dataAry = {{ data_array|safe }};
  const dataObj = {{ data_dict|safe }};

  console.log('data:', data);
  console.log('dataAry:', dataAry);
  console.log('dataObj:', dataObj);
</script>

コンソール

data: a
dataAry: (3) ['b', 'c', 'd']
dataObj: {key: 'e'}