Data inheritance

Vento has a parent to child data inheritance system:

Nested templates have access to the parent's data

When a template includes another template (using include or layout), the nested templates have access to the parent data. For example:

{{ set salute = "Hello world" }}

{{ include "child.vto" }}

The nested template can access to the parent variable:

{{ salute }}

This doesn't happen in reverse order. A variable declared in a child component cannot be accessed by the parent template.

Propagation of inheritance

The inheritance works also for multiple nested templates:

{{ set salute = "Hello world" }}

{{ include "child.vto" }}

The child template includes other template:

{{ include "nested-child.vto" }}

And the nested child template prints the variable:

{{ salute }}

Parent templates can edit variables of the nested templates

Parent templates can create or modify existing variables before rendering the nested templates. For example:

{{ set salute = "Hello world" }}

{{ include "child.vto" { salute: "Hi there!", foo: "bar" } }}

In this example, the parent template modifies the salute variable and creates the foo variable. These changes are only available in the context of the nested templates.

Use the default tag to assign a value to a variable only if it's undefined or null. This is useful if you want to use a default value if the parent template doesn't provide the variable:

{{ default salute = "Hello world" }}

{{ salute }}