Prefetching
Prefetch state changes when the user mouses over an HTML element. Fantastico!
<div>
<button wire:click.prefetch="togglePreview">Show Preview</button>
<cfif args.showPreview>
<!--- Preview goes here --->
</cfif>
</div>
component extends="cbwire.models.Component"{
data = {
"showPreview": false
};
function togglePreview(){
data.showPreview = true;
}
}
In the example here, the
togglePreview
action will be prefetched and invoked when the user mouses over the button. The results of the fetch are not displayed until the user clicks the 'Show Preview' button.Prefetching works well for actions that do not perform any side effects, such as mutating session data or writing to a database. If the action you are "pre-fetching" does have side effects, you may encounter unpredictable results.
Last modified 11mo ago