Using VDL Includes
When an app written with VDL becomes large, it is common to require the same functionality in several independent views. There is also a case for creating custom extensions to handle certain features or layouts across multiple views. Both requirements are satisfied with the <vdl-include> element.
<vdl-include> enables you to split out commonly-used functionality into separate VDL files that can be included in multiple views.
A simple example:
<vdl-page> <vdl-include src="heading.vdl"></vdl-include> </vdl-page>This results in the contents of the heading.vdl file replacing the <vdl-include> tag.
if
heading.vdl contained:
<vdl version="4.1">
<h1>Included</h1>
</vdl> The result would be:
<vdl-page> <h1>Included</h1> </vdl-page>Several points to note:
- The included file must be a valid VDL file with the version attribute set to 3.2 or greater.
- The root <vdl> element in the included file is stripped out.
- There is no need to add a <vdl-page> to the included file because the contents may be added at any place in the main view VDL code.
- The initial <vdl-include> element is removed.
- Included VDL files may not themselves use the <vdl-include> element - nesting is not supported.
- An error will result if the included file cannot be found.
- Files are included before all other processing of the view. If a file is included within a conditional section, then the VDL source will be included regardless of whether the conditional is true or false.
- The path for the included file is always relative to the client_resources folder.