Use Python & Django Data Inside Your Vue App

Using Vue CLI, how we can use Django data in Vue? Suppose I have a pandas dataframe or dictionary I want to pass to the Vue app, how to do it?

Two Approaches to Passing Data

def my_view(request):
data = build_your_data()
return render(request, ‘test.html’, {‘data’: data}
<div id=”app”>
<my-component data={{ data }}>
</div>
<template>
{{ data }}
</template>
<script>
module.exports = {
props: [‘data’]
}
</script>

Top writer in Technology | Backend Web Developer | bennettgarner.com

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store