@click-js/click-js

Click-js

Library to use with Click framework.

ClickJs have 3 components:

• Emitter
• Observer
• MiniApp

Emitter

The Emitter have 4 methods:

• $on(eventName, callable) => Method to register an event and hook
• $off(eventName) => Method to unregister an event
• $emit(eventName) => Method to disptach an event
• $once(eventName) => Method to dispatch an event one time

Observer

The Observer have 4 methods:

• $subscribe(callable) => register an observer
• $unsubscribe(callable) => unregister an observer
• $notify(data) => notify all observers with same data

MiniApp

The MiniApp is created by createApp method. This method is accept 3 arguments: elementRoot (a div, i.e.), template function (to render an html), and initialData (an object). After create a mini app, all this app properties are reactives. For add new methods use Click.install method.

    const template = ({count, teste}) => {
        console.log(count, teste)
        let result = "<button id='teste' onclick=\"click.auau()\" >teste2</button>"
        for (let i = 0; i < count; i++) {
            result += `<div>${teste[i]}</div>`
        }
        return result
    }
    const app = click.createApp('#app', template, {count: 1, teste: [2]})
    app.count = app.count + 1

Install method

The ClickJs have a special method, called $install, with an object like argument.

const dog = {
    auau() {
        this.$emit('meu')
        app.teste = [...app.teste, Math.random() * 20]
        app.count = app.count + 1
    }
}

click.$install(dog)

This method allows add dymanically new methods to Click instance, that can be called into miniapp template.