mirrors/django-components
1
0
Fork 0
mirror of https://github.com/django-components/django-components.git synced 2025-08-31 03:07:19 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

🐛Prevent potential null elements

Browse source 
because {% component_js_dependencies %} loads all the components regardless
This commit is contained in:
KimSia, Sim 2022-07-23 14:42:48 +08:00
parent f5c3f64c86
commit bb256f2ec8
No known key found for this signature in database
GPG key ID: 5C51FB99C703F242
2 changed files with 9 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

10
README.md
View file

@ -220,7 +220,9 @@ Then you need a javascript file that specifies how you interact with this compon
```js
/* In a file called [project root]/components/calendar/script.js */
(function(){
document.querySelector(".calendar-component").onclick = function(){ alert("Clicked calendar!") }
if (document.querySelector(".calendar-component")) {
document.querySelector(".calendar-component").onclick = function(){ alert("Clicked calendar!"); };
}
})()
```
@ -336,13 +338,13 @@ Since the header block is unspecified, it's taken from the base template. If you
As you can see, component slots lets you write reusable containers, that you fill out when you use a component. This makes for highly reusable components, that can be used in different circumstances.
If you want to include a slot's default content while adding additional content, you can call `slot.super` to insert the base content, which works similarly to `block.super`.
If you want to include a slot's default content while adding additional content, you can call `slot.super` to insert the base content, which works similarly to `block.super`.
```htmldjango
{% component_block "calendar" date="2020-06-06" %}
{% slot "body" %}{{ slot.super }}. Have a great day!{% endslot %}
{% endcomponent_block %}
```
```
Produces:
@ -367,7 +369,7 @@ By default, components can access context variables from the parent template, ju
NOTE: `{% csrf_token %}` tags need access to the top-level context, and they will not function properly if they are rendered in a component that is called with the `only` modifier.
Components can also access the outer context in their context methods by accessing the property `outer_context`.
Components can also access the outer context in their context methods by accessing the property `outer_context`.
# Available settings

4
sampleproject/components/calendar/calendar.js
View file

@ -1,3 +1,5 @@
(function(){
document.querySelector(".calendar-component").onclick = function(){alert("Clicked calendar!")}
if (document.querySelector(".calendar-component")) {
document.querySelector(".calendar-component").onclick = function(){ alert("Clicked calendar!"); };
}
})()