Table of Contents
Description
The ReactiveComponent
class extends the Component class and provides additional functionality to automatically re-render the component when specified attributes change.
Basic Usage
Extend the ReactiveComponent
class to create a component that automatically re-renders when specified attributes change.
import ReactiveComponent from 'kempo';
class MyReactiveComponent extends ReactiveComponent {
constructor(){
super();
// Your Constructor
}
static get renderOnChange(){
return ['my-attr'];
}
async render(force){
if(await super.render(force)){
// Your render logic
return true;
}
return false;
}
}
window.customElements.define('my-reactive-component', MyReactiveComponent);
JavaScript Reference
Constructor
Extends Component
new ReactiveComponent()
Requirements
Attributes
The ReactiveComponent
class does not introduce any new attributes beyond those provided by the Component class.
Methods
attributeChangedCallback(n, oV, nV): void
Overrides the attributeChangedCallback
method to automatically re-render the component when specified attributes change.
Properties
static renderOnChange: Array
An array of attribute names that should trigger a re-render when they change. This property should be overridden in your component class.