extend
Define the behavior of a custom element.
Component.extend(prototype)
Extends the can-component constructor function with prototype properties and methods. Registers the component by its tag with can-view-callbacks.tag.
var Component = require("can-component");
var stache = require("can-stache");
var DefineMap = require("can-define/map/map");
var VM = DefineMap.extend({ ... });
Component.extend({
tag: "tag-name",
ViewModel: VM,
view: stache(" .... ")
});
Parameters
- prototype
{Object}
:An object set as the prototype of the constructor function. You will typically provide the following values on the prototype object:
tag {tag} - Defines the tag on which instances of the component constructor function will be created.
ViewModel {ViewModel} - Specifies an object that is used to render the component’s view.
view {view} - Specifies the view rendered within the custom element.
And sometimes the following values are provided:
Use
Note that inheriting from components works differently than other CanJS APIs. You can’t call .extend
on a particular component to create a “subclass” of that component.
Instead, components work more like HTML elements. To reuse functionality from a base component, build on top of it with parent components that wrap other components in their view and pass any needed viewModel properties via attributes.