import {Component} from '@crispcode/modux/scripts/libs/component.js'

public class | source

Component

This class is used to create web components

Constructor Summary

Public Constructor
public	constructor(parent: HTMLElement, module: Module, store: Store) Creates an instance of Component

Member Summary

Public Members
public	element: HTMLElement The component view
public	module: Module The parent module instance
public	parent: HTMLElement The parent wrapper
public	store: Store The pushstore instance of the module parent
public get	template: string The html string or HTMLElement that becomes the view for this component
public	uid: String A unique identifier

Method Summary

Public Methods
public	execute() The method gets called when the component gets created in the page.
public	init() The method gets called before the template is attached.
public	onStateChange(url: URL) The method gets called whenever the state changes
public	terminate() The method gets called when the component calls destroy().

Public Constructors

public constructor(parent: HTMLElement, module: Module, store: Store) source

Creates an instance of Component

Params:

Name	Type	Attribute	Description
parent	HTMLElement		The parent wrapper
module	Module		The parent module instance
store	Store		An instance of @crispcode/pushstore, see https://www.npmjs.com/package/@crispcode/pushstore

Public Members

public element: HTMLElement source

The component view

public module: Module source

The parent module instance

public parent: HTMLElement source

The parent wrapper

public store: Store source

The pushstore instance of the module parent

public get template: string source

The html string or HTMLElement that becomes the view for this component

public uid: String source

A unique identifier

Public Methods

public execute() source

The method gets called when the component gets created in the page. It is the main method of the class

public init() source

The method gets called before the template is attached. This is useful for modifing the template before the MutationObserver starts tracking it or add dependencies for template elements

public onStateChange(url: URL) source

The method gets called whenever the state changes

Params:

Name	Type	Attribute	Description
url	URL		The current url

public terminate() source

The method gets called when the component calls destroy(). It can be used to remove handlers or clear timeouts