-
- GitHub
- GitLab
- Bitbucket
-
By logging in you accept
our terms of service
and privacy policy
A set of helper tags and form widgets for making django and vue play nicely.
A set of helper tags and form widgets for making django and vue play nicely.
pip install djangovue
class IndexView(TemplateView):
template = 'index.html'
def get_context_data(self, **kwargs):
context = super().get_context_data(**kwargs)
context['message'] = 'Hello from Django'
return context
{% load djangovue %}
{% load_vuejs %}
{% djangovue on %}
<div id="app">
<p>
{{ message }}
</p>
{% djangovue off %}
<p>
{{ message }}
</p>
{% enddjangovue off %}
</div>
<script>
new Vue({
el: '#app',
data: {
message: 'Hello from Vue'
}
});
</script>
{% enddjangovue%}
from django import forms
from djangovue import widgets
class UserForm(forms.Form):
username = forms.CharField(
max_length=30,
widget=widgets.TextInput(
model="user.username",
modifier=widgets.TextInput.LAZY,
attrs={":disabled": "disable"},
),
)
first_name = forms.CharField(
max_length=30,
widget=widgets.TextInput(
model="user.first_name", attrs={":disabled": "disable"}
),
)
last_name = forms.CharField(
max_length=30,
widget=widgets.TextInput(
model="user.last_name", attrs={":disabled": "disable"}
),
)
gender = forms.ChoiceField(
choices=[("male", "Male"), ("female", "Female")],
widget=widgets.RadioSelect(
attrs={"v-model": "user.gender", ":disabled": "disable"}
),
)
disable = forms.BooleanField(
required=False, widget=widgets.CheckboxInput() # v-model will automatically be set to `disable`
)
Should you wish to develop the library there are some helper functions within the Makefile to get you started.
make install # Installs the project dependencies including the node modules required for the DjangoVue Vue plugin
make bundle # Transpiles and bundles the DjangoVue.ts file
make test # Runs tests
make black # Applies black formatting to the project
Once installed run the following to view the examples:
cd djangovue/examples
poetry run ./manage.py runserver
Note this project uses Poetry for packaging and managing dependencies.
The Tidelift Subscription provides access to a continuously curated stream of human-researched and maintainer-verified data on open source packages and their licenses, releases, vulnerabilities, and development practices.
Learn more →Something wrong with this page? Make a suggestion
Export .ABOUT file for this package
Last synced: 2021-02-14 16:34:08 UTC
Login to resync this project