undefined

bokuweb.me

MithrilでMaterial Design Liteを使用するメモ


f:id:bokuweb:20150821220030g:plain

MaterialDesignLiteのコンポーネントは基本的にはJavascriptを用いているので、そのままでは動作しない。 mithril本の「5.6 BootstrapのJavaScriptを利用したコンポーネントを利用する」を参考にした。 具体的にはconfig擬似属性を使用して初回描画完了時にcomponentHandler.upgradeDom()を呼べばいいっぽい。

view = ->
  m "div",  [
    m "div#sample1.mdl-textfield.mdl-js-textfield", {config : upgradeMdl}, [
      m "input.mdl-textfield__input[type='text']",
        oninput : m.withAttr "value", vm.checkWord
      m "label.mdl-textfield__label[for='sample1']", "Text..."
    ]
  ]
  
upgradeMdl = (el, isInit, ctx) ->
  componentHandler.upgradeDom() unless isInit

これ書いてる最中にpolytheneの存在を知った。見落としてた。 どっちがいいんだろ。