SOURCE

const m = require('mithril');

const btn = require('polythene/button/button');
const card = require('polythene/card/card');
const notification = require('polythene/notification/notification');

require('polythene/theme/theme');


/******* MyComponent *******/

const MyComponent = {};

MyComponent.view = function(ctrl, args) {
  return m('div.my-component', {
    key: args.key
  }, [
    m('p', '这是一个测试组件：' + (args.key || 0)),
    m(btn, {
      label: args.btnLabel,
      raised: true,
      events: {
        onclick: args.btnOnClick
      },
    }),
  ]);
};


/******* App *******/

var App = {};

App.controller = function() {
  this.title = 'Mithril 示例';
};

App.view = function(ctrl) {
  // const content = m(MyComponent, { btnLabel: '按钮', btnOnClick });
  const content = [];
  for (let i = 1; i <= 3; i++) {
    const key = i;
    const btnLabel = `按钮 ${key}`;
    const btnOnClick = function() {
      notification.show({
        title: `来自组件 ${key}`,
        timeout: 0.5,
        containerSelector: '#notifications',
      });
    };
    content.push(m(MyComponent, {
      key,
      btnLabel,
      btnOnClick
    }));
  };

  return [
    m(card, {
      content: [{
        primary: {
          title: ctrl.title
        }
      }, {
        text: {
          content
        }
      }]
    }),
    m('#notifications', m.component(notification))
  ];
};

m.mount(document.body, App);

.my-component {
  border: 1px dashed #ccc;
  margin-top: 20px;
  padding: 15px;
}