Templates
Your Wire's HTML. Simple as that. Honestly.
By default, Templates exist within your project under
./views/wires/[templateName].cfm
. You can override the default template location with the configuration setting templatesLocation.
See ConfigurationIf you haven't specified your template file name inside your Wire using template, a template will be implicitly loaded based on the Wire's file name.
component extends="cbwire.models.Component" {
// No template defined.
}
For the example above, the template
./views/wires/tasklist.cfm
will be rendered.File names should be lowercase when using Implicit Lookups. This is to avoid issues on case-sensitive file systems.
You can specify the path to your Template using
template
. component extends="cbwire.models.Component" {
template = "wires/tasklist"; // This will look for ./views/wires/tasklist.cfm
// template = "path/to/tasklist"; <--- Can use folders
// template = "tasklist.cfm"; <--- Can use .cfm if you like
}
In CBWIRE 1.x, you would define the template path using
view
but this has been deprecated and template
should be used going forward.Within your Actions, you can call the method
noRender()
to prevent your template from re-rendering. This can reduce the returned payload size for actions that do not change the UI. component extends="cbwire.model.Component"{
// Action
function updateSession(){
// prevent UI updating
noRender();
}
}
Be sure your template includes a single outer element such as
<div>
. <!--- GOOD --->
<cfoutput>
<div>
<button wire:click="addTask">Add Task</button>
</div>
</cfoutput>
<!--- BAD --->
<cfoutput>
<div>
<button wire:click="addTask">Add Task</button>
</div>
<div>
<h1>Tasks</h1>
</div>
</cfoutput>
If an outer element is not detected, an OuterElementNotFoundexception is thrown.
You can use something other than <div></div>.
Last modified 29d ago