Skip to content

Use mithril views to render server side

License

Notifications You must be signed in to change notification settings

MithrilJS/mithril-node-render

Folders and files

NameName
Last commit message
Last commit date

Latest commit

e5857b7 · Sep 2, 2024
Sep 2, 2024
Aug 24, 2019
Aug 24, 2019
Jan 17, 2020
Aug 24, 2019
Sep 17, 2021
Feb 12, 2018
Oct 15, 2014
May 27, 2022
Sep 17, 2021
Mar 20, 2024
Apr 18, 2023
Sep 17, 2021

Repository files navigation

mithril-node-render

zulip, join chat Build Status rethink.js no dependencies

Use mithril views to render server side

Demo

Usage Example

Installation

npm install mithril-node-render

Usage

// Make Mithril happy
if (!global.window) {
  global.window = global.document = global.requestAnimationFrame = undefined
}

var m = require('mithril')
var render = require('mithril-node-render')

render(m('span', 'huhu')).then(function (html) {
  // html === '<span>huhu</span>'
})

var html = render.sync(m('span', 'huhu'))
// html === '<span>huhu</span>'

Async components

As you see the rendering is asynchronous. It lets you await certain data from within oninit hooks.

var myAsyncComponent = {
  oninit: function (node, waitFor) {
    waitFor(new Promise(function (resolve) {
      node.state.foo = 'bar'
      resolve()
    }))
  },
  view: function (node) {
    return m('div', node.state.foo)
  }
}

render(myAsyncComponent).then(function (html) {
  // html === '<div>bar</div>'
})

Sync rendering

You can also render synchronously. You just don't get the waitFor callback.

var myAsyncComponent = {
  oninit: function (node, waitFor) {
    // waitFor === undefined
    new Promise(function (resolve) {
      node.state.foo = 'bar'
      resolve()
    })
  },
  view: function (node) {
    return m('div', node.state.foo)
  }
}

var html = render.sync(myAsyncComponent)
// html === '<div>bar</div>'

Options

Optionally pass in options as an object: render(component, options).

The following options are supported:

escapeAttribute(value) Default: render.escapeAttribute A filter function for attribute values. Receives value, returns what is printed.

escapeText(value) Default: render.escapeText A filter function for string nodes. Receives value, returns what is printed.

strict Default: false Set this to true to close all empty tags automatically. Default is standard HTML mode where tags like <br> and <meta> are allowed to implicitly close themselves. This should be set to true if you're rendering XML-compatible HTML documents.

xml Default: false Set this to true to render as generic XML instead of (possibly XML-compatible) HTML. Default is HTML mode, where children of void elements are ignored. This implies strict: true.

See also