Comment on page
Computed Properties
Dynamic, cached, properties that can return any CFML data type.
Computed Properties are dynamic properties and are helpful for deriving values from a database or another persistent store like a cache.
- They are declared as inline functions using computed.
- They can return any CFML data type, not just values that can be parsed by JavaScript like Data Properties.
You can define Computed Properties on your components using computed.
<cfscript>
computed = {
"tasks": function() {
return queryExecute( "
select *
from tasks
" );
}
};
</cfscript>
You can access Computed Properties in your component template using propertyName().
<cfscript>
computed = {
"currentTime": function() {
return now();
}
};
</cfscript>
<cfoutput>
<div>
Current time: #currentTime()#
</div>
</cfoutput>
<cfscript>
computed = {
"currentTime" : function() {
return now();
}
};
function sendEmail() {
if ( dateDiff( "d", computed.currentTime() ) > 3 ) {
}
}
</cfscript>
Computed Properties are defined as a CFML closure. That means that to get the result from the function, you must invoke it like so.
myComputedProperty() // good
myComputedProperty // bad
Computed Properties are cached for the lifetime of the request. If you reference your Computed Property three times in your component template or from within a component action, it will only execute once.
<cfscript>
computed = {
"getUUID": function() {
return createUUID();
}
}
</cfscript>
<cfoutput>
<div>
<p>#getUUID()#</p>
<p>#getUUID()#</p> <!-- Outputs the same ID because of caching -->
</div>
</cfoutput>
You can prevent caching on a computed property by passing a false argument when invoking it.
<p>#getUUID()#</p>
<p>#getUUID( false )#</p> <!-- Does not use caching --->
Last modified 2mo ago