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.controller = function() {
  this.count = parseInt(localStorage.getItem('MyComponent_count') || 0, 10);
}

MyComponent.view = function(ctrl) {
  function dec() {
    ctrl.count--;
    localStorage.setItem('MyComponent_count', ctrl.count);
  }

  function inc() {
    ctrl.count++;
    localStorage.setItem('MyComponent_count', ctrl.count);
  }
  
  return m('div.my-component', [
    m('h3', ctrl.count),
    m(btn, {
      label: '-1',
      raised: true,
      events: {
        onclick: dec
      },
    }),
    m(btn, {
      label: '+1',
      raised: true,
      events: {
        onclick: inc
      },
    }),
  ]);
};


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

var App = {};

App.controller = function() {
  this.title = 'Mithril 组件内状态';
};

App.view = function(ctrl) {
  content = m(MyComponent);

  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;
}