Skip to content

Instantly share code, notes, and snippets.

@tobyzerner
Created April 8, 2015 02:38
Show Gist options
  • Save tobyzerner/da3ddbadbc8c20891bb3 to your computer and use it in GitHub Desktop.
Save tobyzerner/da3ddbadbc8c20891bb3 to your computer and use it in GitHub Desktop.
Mithril ES6 Components
import Component from './component';
class Widget extends Component {
init(ctrl) {
var props = this.props;
ctrl.counter = props.initialValue;
ctrl.increment = function() {
ctrl.counter++;
}
ctrl.reset = function() {
ctrl.counter = props.initialValue;
}
}
view(ctrl) {
return m('div', [
m('h1', 'This widget is set up for: '+this.props.name),
m('p', 'Counter: '+ctrl.counter),
m('button', {onclick: ctrl.increment}, 'Increment Counter')
])
}
}
class IndexPage extends Component {
init(ctrl) {
ctrl.widget = new Widget({name: 'foo', initialValue: 2}).instance()
}
view(ctrl) {
return m('div', [
ctrl.widget.render(),
m('button', {onclick: ctrl.widget.reset}, 'Reset Counter')
]);
}
}
m.mount(document.body, new IndexPage());
export default class Component {
constructor(props) {
this.props = props || {};
var component = this;
this.controller = function() {
var ctrl = {};
component.init(ctrl);
return ctrl;
};
this.controller.$original = this.init;
}
init(ctrl) {
}
instance() {
var component = this;
var controller = new this.controller();
controller.render = function() {
return component.view(controller);
};
return controller;
}
}
@stivenson
Copy link

thank you !! man :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment