Rendering Views

renderIt()

You can set your component's template by defining a renderIt() method on your component.
1
component extends="cbwire.models.Component" {
2
3
function renderIt(){
4
// Renders ./views/wires/myView.cfm
5
return this.renderView( "myView" );
6
}
7
8
}
Copied!

variables.view

You can also set your component template using variables.view as an alternative to renderIt().
1
component extends="cbwire.models.Component" {
2
variables.view = "myView";
3
}
4
Copied!

Implicit Lookup

If you haven't set your component's view using renderIt() or variables.view, cbwire will look for a file that matches your component's file name.
1
// File: ./wires/Counter.cfc
2
component extends="cbwire.models.Component" {
3
// No explicit view defined.
4
}
Copied!
For the Counter.cfc example above, cbwire will attempt to render a view located under ./views/wires/counter.cfm
File names should be lowercase when using Implicit Lookups. This is to avoid issues on case-sensitive file systems.

View Example

1
// File: ./views/wires/counter.cfm
2
<!--- GOOD --->
3
<cfoutput>
4
<div>
5
<button wire:click="increment">Increment Counter</button>
6
</div>
7
</cfoutput>
8
9
<!--- BAD --->
10
<cfoutput>
11
<button wire:click="increment">Does Not Work</button>
12
</cfoutput>
Copied!
Be sure that cbwire can bind onto your component's view by including an outer element such as<div>. If an outer element is not detected, cbwire will throw an OuterElementNotFoundexception.
Last modified 20d ago