• Utilities
• Overview
• Properties
• Methods
• Other
• Events
• Extending

Extending w2ui

Since v.2 w2ui provide an easy way to extend functionality of any widget or create custom ones. All widgets are written as classes that extend w2base class. This base class only has the event flow functionality:

• on(event, handler) - method to add an event
• off(event, [handler]) - method to remove an event
• trigger(edata) - method to trigger an event
• handlers, - an array of all event handlers defined for the class

That you can use it to add event listeners and trigger events.
See events for additional information. Below is an example how to create your own custom control. import { w2ui, w2base, query } from 'https://rawgit.com/vitmalina/w2ui/master/dist/w2ui.es6.min.js' class Control extends w2base { constructor(conf) { // custom code super(conf.name) } render(box) { let edata = this.trigger('render', { box }) if (edata.cancelled) { return } this.box = box query(box).html('<div style="background-color: green; width: 200px;">my component</div>') // event's on complete loop edata.finish() } } if (w2ui.some) { delete w2ui.some } let myControl = new Control({ name: 'some' }) myControl.render(query('#main'))

User Comments

comments powered by Disqus