-
-
Notifications
You must be signed in to change notification settings - Fork 925
tebe edited this page Oct 1, 2021
·
35 revisions
Common questions found on Gitter, Google Groups, and Stack Exchange
Contributors: Please link to gists, JSFiddles, etc. instead of providing longer code examples.
See the Mithril Community Page. We are all very friendly people!
- Leo wrote an article on integrating velocity.js here.
- There are several community projects dealing with animation here.
- The Recipes and Snippets page has a few suggestions here.
- Animated Page Flip
- CSS translate
How do I fix this error: "Please ensure the DOM element exists before rendering a template into it."
Try putting the script tag for the offending JavaScript as the last thing inside the body tag or loading it on page load.
<!-- Option 1 -->
<div id="app"></div>
<script>
m.mount(document.getElementById("app"), App)
</script>
<!-- Option 2 -->
<script>
window.onload = function () {
m.mount(document.getElementById("app"), App)
}
document.addEventListener("DOMReady", function () {
m.mount(document.getElementById("app"), App)
})
// etc.
</script>
<div id="app"></div>
A component that has no component ancestors (see Why doesn't my component render?).
- The component view function must return a virtual element, not an array of elements.
// This works
Component.view = function () {
return m("div")
}
// This doesn't
Component.view = function () {
return [m("div")]
}
- Only a top-most component may return an array.
App.view = function () {
return [m("div"), m("div")]
}
// This works
m.render(document.getElementById("body"), m.component(App))
m.render(document.getElementById("body"), m("div", [
m.component(App)
]))
// This doesn't
m.render(document.getElementById("body"), {
view: function () {
return m.component(App)
}
})
m.route(m.route())
Call m.route in a setTimeout with duration 0. (This is a quirk of v0.2.0)
- All on-events cause a redraw.
-
oninput
fires at each single character change in the field. -
onchange
fires when the field is blurred, etc. (try this) - See the MDN
change
event documentation
m.route(body, '/', {
'/': home,
'/test': test,
'/:...other': my404component
});
Check out #1090 for a curated list of what is being discussed/developed for future Mithril additions.